УЧЕБНО-МЕТОДИЧЕСКОЕ ПОСОБИЕ

КУРСА ПО ВЫБОРУ

ДЛЯ УЧАЩИХСЯ 10-Х КЛАССОВ

«ОСНОВЫ WEB-ДИЗАЙНА»

Составитель: Булдакова Т. А., учитель информатики сш № 17

Пояснительная записка

Стремительное и широкое внедрение ресурсов сети Интернет в практическую деятельность человека диктует необходимость подготовки пользователя соответствующего требованиям современной цивилизации. Новые формы партнерских отношений, электронная коммерция, дистанционное образование, активно обновляющаяся информационная система сети Интернет и другие возможности – все это становится неотъемлемой частью деятельности образованного человека. Занять свое активное место во «Всемирной паутине» – это один из критериев успешности современного делового человека.

Цель данного курса состоит в том, чтобы помочь учащимся сориентироваться в богатейших ресурсах Интернет, попробовать себя в роли создателя таких ресурсов, побудить стремление к более глубокому изучению данного материала

Для достижения цели у учащихся формируется основа теоретической базы, элементарные навыки работы в сети Интернет и создания Web-ресурсов. К теоретической части относятся общие сведения о сети Интернет, возможностях использования ее ресурсов для различных видов деятельности, способах передачи информации в сети Интернет, основах Web-дизайна. В практической части предусматривается работа по поиску необходимых Web-ресурсов в сети, осуществление контакта с другими пользователями Интернет, создание простейшего Web-проекта.

Предлагаемое пособие представляет особый интерес, так как оно призвано помочь учителю.

В данном учебно-методическом пособии дается не только теоретический материал, но и разработаны практические работы.

СОДЕРЖАНИЕ.

I.Локальные и глобальные сети…………………4

II.Ресурсы сети Интернет и их использование

Службы сети Интернет……………………………15

Возможности использования ресурсов сети

Интернет……………………………………………28

Практическая работа №1. Поиск определенной

информации в WWW……………………………..34

Практическая работа №2. Использование

электронной почты……………………………….39

III.Основы Web-дизайна.

Основные понятия………………………………..49

Рекомендации по компьютерному дизайну…….60

Рекомендации по подготовке текста……………63

Рекомендации по использованию цветовой

палитры…………………………………………..65

IV.Создание Web-странички.

Создание простых Web-страниц………………..70

Создание гиперссылок и гиперсвязей…………..82

Возможности включения фреймов……………..86

Знакомство с HTML……………………………...90

Форматирование текста…………………………110

Совершенствование проекта.

Использования собственного шаблона

web-сайта…………………………………………124

Используемая литература……………………….126

1. ЛОКАЛЬНЫЕ И ГЛОБАЛЬНЫЕ СЕТИ.

1. Компьютерные сети.

2. Локальные компьютерные сети.

3. Глобальные сети.

4. Международные требования к сетям

1. Компьютерные сети.

Информационные технологии с применением автономно работающей ПЭВМ значительно расширяют интеллектуальные возможности пользователя. Однако более значительный эффект от использования ПЭВМ можно получить при объединении отдельных ПЭВМ организации, предприятия, фирмы и др. в локальную компьютерную сеть, которая обеспечивает функционирование фирмы как единой слаженной системы. Локальные сети объединяют все службы фирмы, ускоряют документооборот, хранят необходимую информацию и предоставляют ее работникам фирмы и др. Естественным продолжением тенденции развития информационных технологий являются компьютерные телекоммуникации и глобальные сети, обеспечивающие доступ пользователей к информационным ресурсам всей страны и выход в мировое информационное пространство. Глобальные сети объединяют правительственные учреждения, промышленные корпорации, университеты и колледжи, исследовательские центры, коммерческие компании и общественные организации. Сейчас важнейшая роль в мировых телекоммуникациях принадлежит, конечно же, Internet, которая охватывает практически все страны, содержит информацию обо всех сторонах человеческой деятельности, не знает пограничных и цензурных ограничений. В настоящее время компьютерные технологии получили широкое распространение практически во всех областях деятельности человека.

Сеть в самом общем понимании — это совокупность компьютеров и других устройств (принтеры, сканеры и т.д.), взаимосвязанных каналами передачи данных, и необходимых для реализации этой взаимосвязи программного обеспечения и (или) технических средств, предназначенных для организации распределенной обработки данных. В такой системе любое из подключенных устройств может использовать ее для передачи или получения информации. По размерности различают локальные и глобальные сети.

Прежде всего, следует различать On-line доступ к сети, дающий доступ ко всем возможностям, предоставляемым Интернет. При таком доступе обработка запросов пользователя происходит в режиме реального времени.

Off-line доступ происходит по-другому: задание для сети готовится заранее, а при соединении происходит лишь передача или прием подготовленных данных. Такой доступ менее требователен к качеству и скорости каналов связи (если данные не очень большие), но обычно дает лишь возможность пользоваться E-mail — электронной почтой. По электронной почте можно подписаться на сетевые конференции по самым различным темам — от обсуждения литературных произведений до поиска работы или получения биржевых сводок. Это даст возможность эффективнее использовать такой вид доступа.

Персональный доступ в Интернет осуществляется обычно через поставщика доступа в Интернет (провайдера). Абонент соединяет свой компьютер с сервером доступа, пользуясь модемом, по обычной телефонной линии или по выделенному каналу связи с помощью протокола TCP/IP. Если ваше предприятие уже соединено с Интернет, доступ можно осуществить через локальную сеть предприятия.

Виды подключения к сети рассмотрены ниже. Отметим еще раз, что для каждого из перечисленных ниже типов подключения требуется специальное устройство.

· Телефонные сети (модемное подключение) - максимально может передаваться 56 кбит/с, т.к. именно в такое количество цифровой информации можно передать посредством телефонных линий (максимально по линиям передается 2,5 кГц частот человеческого голоса – это и накладывает ограничение на передачу данных). В любом случае это самая медленная связь;

· Сотовая связь - условия подключения надо уточнять у каждого оператора сотовой связи; требуется телефон, в настройках которого есть такая функция;

· Системы xDSL - специальный модем в телефонной компании, который позволяет одновременно разговаривать и пользоваться Интернетом;

· Витая пара (обычно для выделенных линий);

· Оптоволоконное подсоединение;

· Сети кабельного телевидения;

· Спутниковое подключение;

· Радио-модем. Обычно данный вид подключения используется, если рядом находится провайдер связи (в зоне видимости);

· Другие.

В данном случае пользователям можно дать такие рекомендации:

· Выбирая одного из провайдеров, сравните предлагаемые ими наборы услуг;

· Обратите внимание, где территориально находится провайдер. Ведь передача данных осуществляется по телефонным проводам, а линии связи находятся в плохом состоянии;

· Имеет значение число телефонных линий провайдера (модемный пул), легко ли будет к нему дозвониться. Для того чтобы вы могли работать с Интернет, пользуясь встроенными возможностями Windows 95 или UNIX, провайдер должен поддерживать доступ по протоколу равноправной связи (Point-to-Point Protocol, PPP);

· Кроме того, следует обратить внимание, может ли провайдер обеспечить почтовый ящик электронной почты (обычно это дополнительная услуга).

2. Локальные компьютерные сети

Локальные сети — сети, действующие в пределах некоторой ограниченной территории (протяженность — от нескольких метров до нескольких километров). Эти сети также называют ЛВС (Локальные Вычислительные Сети), или LAN (Local Area Network). И обычно они охватывают какое-либо отделение предприятия и не выходят за пределы одного здания.

Локальная сеть обладает рядом неоспоримых преимуществ:

· один принтер (или другое устройство), подключенный к сети, позволяет уменьшить затраты на печать документов с разных компьютеров;

· совместное использование файлов позволяет правильно использовать дисковое пространство и вести упорядоченный процесс обработки документов;

· передача сообщений и почты по сети позволяет существенно уменьшить использование бумажной документации.

Подавляющая часть компьютеров западного мира объединена в ту или иную сеть. Опыт эксплуатации сетей показывает, что около 80% всей пересылаемой по сети информации замыкается в рамках одного офиса. Поэтому особое внимание разработчиков стали привлекать так называемые локальные вычислительные сети (LAN). Локальные вычислительные сети отличаются от других сетей тем, что они обычно ограничены умеренной географической областью (одна комната, одно здание, один район).

Существует два типа компьютерных сетей: одноранговые сети и сети с выделенным сервером. Одноранговые сети не предусматривают выделение специальных компьютеров, организующих работу сети. Каждый пользователь, подключаясь к сети, выделяет в сеть какие-либо ресурсы (дисковое пространство, принтеры) и подключается к ресурсам, предоставленным в сеть другими пользователями. Такие сети просты в установке, налаживании; они существенно дешевле сетей с выделенным сервером. В свою очередь сети с выделенным сервером, несмотря на сложность настройки и относительную дороговизну, позволяют осуществлять централизованное управление.

Локальная сеть представляет собой набор компьютеров, периферийных устройств (принтеров и т. п.) и коммутационных устройств, соединенных кабелями. В качестве кабеля используются «толстый» коаксиальный кабель, «тонкий» коаксиальный кабель, витая пара, волоконно-оптический кабель. «Толстый» кабель, в основном, используется на участках большой протяженности при требованиях высокой пропускной способности. Волоконно-оптический кабель позволяет создавать протяженные участки без ретрансляторов при недостижимой с помощью других кабелей скорости и надежности. Однако стоимость кабельной сети на его основе высока, и поэтому он не нашел пока широкого распространения в локальных сетях. В основном локальные компьютерные сети создаются на базе «тонкого» кабеля или витой пары.

Первоначально сети создавались по принципу "тонкого" Ethernet. В основе его — несколько компьютеров с сетевыми адаптерами, соединенные последовательно коаксиальным кабелем, причем все сетевые адаптеры выдают свой сигнал на него одновременно. Недостатки этого принципа выявились позже.

С ростом размеров сетей параллельная работа многих компьютеров на одну единую шину стала практически невозможной: очень велики стали взаимные влияния друг на друга. Случайные выходы из строя коаксиального кабеля (например, внутренний обрыв жилы) надолго выводили всю сеть из строя. А определить место обрыва или возникновения программной неисправности, "заткнувшей" сеть, становилось практически невозможно.

Поэтому дальнейшее развитие компьютерных сетей происходит на принципах структурирования. В этом случае каждая сеть складывается из набора взаимосвязанных участков — структур.

Каждая отдельная структура представляет собой несколько компьютеров с сетевыми адаптерами, каждый из которых соединен отдельным проводом — витой парой — с коммутатором. При необходимости развития к сети просто добавляют новую структуру.

При построении сети по принципу витой пары можно проложить больше кабелей, чем установлено в настоящий момент компьютеров. Кабель проводится не только на каждое рабочее место, независимо от того, нужен он сегодня его владельцу или нет, но даже и туда, где сегодня рабочего места нет, но возможно появление в будущем. Переезд или подключение нового пользователя в итоге потребует лишь изменения коммутации на одной или нескольких панелях.

Структурированная система несколько дороже традиционной сети за счет значительной избыточности при проектировании. Но зато она обеспечивает возможность эксплуатации в течение многих лет.

Для сетей, построенных по этому принципу, появляется необходимость в специальном электронном оборудовании. Одно из таких устройств — хаб — является коммутационным элементом сети. Каждый хаб имеет от 8 до 30 разъемов (портов) для подключения либо компьютера, либо другого хаба. К каждому порту подключается только одно устройство. При подключении компьютера к хабу оказывается, что часть электроники сетевого интерфейса находится в компьютере, а часть — в хабе. Такое подключение позволяет повысить надежность соединения. В обычных ситуациях, помимо усиления сигнала, хаб восстанавливает преамбулу пакета, устраняет шумовые помехи и т. д.

Хабы являются сердцем системы и во многом определяют ее функциональность и возможности. Даже в самых простых хабах существует индикация состояния портов. Это позволяет немедленно диагностировать проблемы, вызванные плохими контактами в разъемах, повреждением проводов и т. п. Существенным свойством такой структурированной сети является ее высокая помехоустойчивость: при нарушении связи между двумя ее элементами, остальные продолжают сохранять работоспособность. Задача соединения компьютерных сетей различных организаций, зачастую созданных на основе различных стандартов, вызвала появление специального оборудования (мостов, маршрутизаторов, концентраторов и т. п.), осуществляющего такое взаимодействие.

3. Глобальные сети

Глобальные сети обеспечивают соединение большого числа абонентов на больших территориях, охватывающих регионы, страны и континенты, использующие для передачи данных оптоволоконные магистрали, спутниковые системы связи и коммутируемую телефонную сеть.

Объединение глобальных и локальных сетей в ассоциации сетей составляет интерсеть, ярким примером которой является Internet (Интернет). При этом работа внутри этой сети осуществляется по единым правилам (протоколам).

Огромная популярность Интернет повлияла на развитие корпоративных сетей Intranet и межкорпоративных сетей Extranet. Иногда эти сети называют глобальными ЛВС, а работа с ними аналогична работе с Интернет. В настоящее время Интернет объединяет множество серверов во всех странах мира, на которых находится огромный объем информации (в виде текста, файлов различного формата, есть возможность скачать программное обеспечение и многое др.) по разнообразным темам.

Для подключения к удаленным компьютерным сетям используются телефонные линии.

Процесс передачи данных по телефонным линиям должен происходить в форме электрических колебаний - аналога звукового сигнала, в то время как в компьютере информация хранится в виде кодов. Для того чтобы передать информацию от компьютера через телефонную линию, коды должны быть преобразованы в электрические колебания. Этот процесс носит название модуляции. Для того чтобы адресат смог прочитать на своем компьютере то, что ему отправлено, электрические колебания должны быть обратно превращены в машинные коды - демодуляция. Устройство, которое осуществляет преобразование данных из цифровой формы, в которой они хранятся в компьютере в аналоговую (электрические колебания), в которой они могут быть преданы по телефонной линии, и обратно называется модем (сокращенно от МОдулятор-ДЕМодулятор). Компьютер в этом случае должен иметь специальную телекоммуникационную программу, которая управляет модемом, а также отправляет и получает последовательности сигналов передаваемой информации.

4. Международные требования к сетям

В настоящее время Международная организация стандартов разработала более 25 стандартов на локальные сети. Рассмотрим основные требования стандартов к учрежденческим сетям:

- возможность подключения современных, ранее разработанных
и перспективных ПЭВМ и периферийных устройств;

- скорость передачи данных должна быть не менее 1 Мбит/с;

- отключение и подключение компонентов сети не должно нарушать общую работу сети более чем на 1 с;

- средства обнаружения ошибок, имеющиеся в сети, должны выявлять все сообщения, содержащие 4 и более искаженных битов;

- надежность сети должна обеспечивать не более 20 мин простоя сети в год.

Международные стандарты предъявляют высокие требования к локальным сетям. Поэтому требования международных стандартов удовлетворяют лишь ряд сетей, выпускаемых ведущими электронными фирмами мира.

2. РЕСУРСЫ СЕТИ ИНТЕРНЕТ И ИХ ИСПОЛЬЗОВАНИЕ.

2.1 Службы сети Интернет.

1.Что такое Интернет

2.История сети INTERNET

3. Доступ в Интернет

4. Из чего состоит Internet?

5. Кто управляет Internet?

6.Кто платит?

1.Что такое Интернет?

Internet – это обширная, разветвленная сеть, объединяющая компьютеры, расположенные в самых отдаленных точках Земли. Оценить размеры этой глобальной паутины сетей невозможно. Согласно некоторым источникам Internet охватила более 100 стран и объединила 50 тыс. отдельных сетей; к Internet подключены более пяти млн. компьютеров и зарегистрировано более 30 млн. пользователей! Авторы последних обзоров попытались оценить размеры сети, посылая запросы на серверы. Результаты таковы: в Internet активно работают примерно 22 млн. пользователей, среди них поставщики услуг и абоненты, использующие такие средства, как Mosaic, Telnet и FTP2. Конкретные цифры различаются между собой, и это неудивительно. Легко попасть в затруднение, когда новые данные о росте Internet появляются почти так же быстро, как и новые серверы. Сопоставьте эти данные с 150-200 млн. персональных компьютеров, установленных во всем мире и нам откроется потрясающая возможность развития сетевых коммуникаций. Домашние компьютеры редко объединяются в сеть. Но многие пользователи хотели бы иметь доступ к ресурсам Internet и дома, и на работе. Решение проблемы – модем и соединение по телефонной линии.

До недавнего времени доступ в Internet был затруднен, но рост числа поставщиков услуг в сети заметно изменил ситуацию. Сейчас большинство провайдеров предоставляет полный набор услуг Internet. Коммерческие сети, такие как CompuServe и America Online, также предоставляют подключение к Internet. Еще в апреле 1995 г. CompuServe реализовала доступ к своим узлам через PPP (Point –to- Point Protocol- протокол узел-узел), с этого момента телефонный номер CompuServe обеспечивал прямой доступ в Internet. До этого времени CompuServe предоставляла основные услуги Internet, такие как FTP (File Transfer Protocol-протокол передачи файлов) и телеконференции UseNet (дискуссии практически на любую тему), которые были доступны абонентам через шлюзы.

America Online также энергично вступила в бой. Уже имея опыт в области электронной почты и UseNet, она быстро начала осваивать рынок услуг World Wide Web.

Новая гипертекстовая среда, логически связавшая между собой данные, часто расположенные на разных континентах, стала самой лучшей приманкой для новых пользователей Internet. Рост числа абонентов World Wide Web происходит быстрее, чем рост самой Internet. На сегодняшний день доступны около 30 тыс. Web-серверов, а число новых Web-страниц ежемесячно увеличивается на 20%. В дальнейшем темпы роста числа пользователей не собираются снижаться, это справедливо как для коммерческих сетей, так и для провайдеров предоставляющих доступ в режиме shell (доступ через оболочку UNIX).

Производят впечатление и перемены в методах доступа. По мере возрастания интереса к использованию в сеансах Internet графического интерфейса, позволяющего оперировать выпадающим меню и мышью, провайдеры стали снижать цены на соединение, позволяющие использовать данные программы. Цены на подключение по SLIP (Serial Line Internet Protocol – межсетевой протокол последовательного канала) и PPP стали снижаться, и основная масса пользователей поняли, что возможность применения тех или иных инструментальных средств зависит от того, каким способом они подключены к сети. Сегодня оба метода доступа существуют в Internet « на равных », а программы с графическим интерфейсом становятся все более популярны.

Internet, служившая когда-то исключительно исследовательским и учебным группам, чьи интересы простирались вплоть до доступа к суперкомпьютерам, становится все более популярной в деловом мире.

Компании соблазняют быстрота, дешевая глобальная связь, удобство для проведения совместных работ, доступные программы, уникальная база данных сети Internet. Они рассматривают глобальную сеть как дополнение к своим собственным локальным сетям.

При низкой стоимости услуг пользователи могут получить доступ к коммерческим и некоммерческим информационным службам США, Канады, Австралии и многих европейских стран. В архивах свободного доступа сети Internet можно найти информацию практически по всем сферам человеческой деятельности, начиная с новых научных открытий до прогноза погоды на завтра.

Кроме того Internet предоставляет уникальные возможности дешевой, надежной и конфиденциальной глобальной связи по всему миру. Это оказывается очень удобным для фирм имеющих свои филиалы по всему миру, транснациональных корпораций и структур управления. Обычно, использование инфраструктуры Internet для международной связи обходится значительно дешевле прямой компьютерной связи через спутниковый канал или через телефон.

Электронная почта - самая распространенная услуга сети Internet. В настоящее время свой адрес по электронной почте имеют приблизительно 20 миллионов человек. Посылка письма по электронной почте обходится значительно дешевле посылки обычного письма. Кроме того сообщение, посланное по электронной почте дойдет до адресата за несколько часов, в то время как обычное письмо может добираться до адресата несколько дней, а то и недель. В настоящее время Internet испытывает период подъема, во многом благодаря активной поддержке со стороны правительств европейских стран и США.

2.История сети INTERNET

В 1961 году Defence Advanced Research Agensy (DARPA) по заданию министерства обороны США приступило к проекту по созданию экспериментальной сети передачи пакетов. Эта сеть, названная ARPANET, предназначалась первоначально для изучения методов обеспечения надежной связи между компьютерами различных типов. Многие методы передачи данных через модемы были разработаны в ARPANET. Тогда же были разработаны и протоколы передачи данных в сети - TCP/IP. TCP/IP - это множество коммуникационных протоколов, которые определяют, как компьютеры различных типов могут общаться между собой.

Эксперимент с ARPANET был настолько успешен, что многие организации захотели войти в нее, с целью использования для ежедневной передачи данных. И в 1975 году ARPANET превратилась из экспериментальной сети в рабочую сеть. Ответственность за администрирование сети взяло на себя Defence Communication Agency (DCA), в настоящее время называемое Defence Information Systems Agency (DISA). Но развитие ARPANET на этом не остановилось; Протоколы TCP/IP продолжали развиваться и совершенствоваться.

В 1983 году вышел первый стандарт для протоколов TCP/IP, вошедший в Military Standarts (MIL STD), т.е. в военные стандарты, и все, кто работал в сети, обязаны были перейти к этим новым протоколам. Для облегчения этого перехода DARPA обратилась с предложением к руководителям фирмы Berkley Software Design - внедрить протоколы TCP/IP в Berkeley(BSD) UNIX. С этого и начался союз UNIX и TCP/IP.

Спустя некоторое время TCP/IP был адаптирован в обычный, то есть в общедоступный стандарт, и термин Internet вошел во всеобщее употребление. В 1983 году из ARPANET выделилась MILNET, которая стала относиться к Defence Data Network (DDN) министерства обороны США. Термин Internet стал использоваться для обозначения единой сети: MILNET плюс ARPANET. И хотя в 1991 году ARPANET прекратила свое существование, сеть Internet существует, ее размеры намного превышают первоначальные, так как она объединила множество сетей во всем мире. Хостом в сети Internet называются компьютеры, работающие в многозадачной операционной системе (Unix, VMS), поддерживающие протоколы TCP\IP и предоставляющие пользователям какие-либо сетевые услуги.

3. Доступ в Интернет

Доступ в Internet, обычно, получают через поставщиков услуг (service provider). Поставщики эти продают различные виды услуг, каждый из них имеет свои преимущества и недостатки. Так же как и при покупке садовой тачки (в оригинале - автомобиля) вы решаете, какими качествами должна она обладать, сколько вы за нее можете себе позволить заплатить, и, исходя из этого, выбираете подходящий вариант из предлагаемого множества.

Но перед тем как начать действовать в этом направлении, т.е. добывать список поставщиков Internet, читать и выбирать, связываться с ними, выясните, а не имеете ли вы уже доступа в Internet, сами того не ведая. Такое вполне может иметь место - в России не так часто, в США не так уж и редко. Если ваша организация или учреждение (институт, компания) уже имеет доступ в Internet, то вряд ли вы сможете получить персональный доступ в сеть лучший, нежели ваша организация.

Другими словами, если вы уже имеете доступ в Internet, вам не надо будет платить денег из своего кармана, не надо будет суетиться вокруг поставщиков услуг и т.д., вам просто надо будет научиться пользоваться тем, что вы уже имеете.

Если ваша организация пока не имеет доступа в Internet, или вообще-то имеет, но, вот беда, не ваше подразделение (лаборатория, отдел, факультет), вам просто следует понаблюдать и прикинуть, сколько еще потенциальных пользователей имеется среди ваших сослуживцев, возможно, поговорить с ними и заручиться поддержкой, составить предложение и/или подать требование вышестоящему руководству.

Имеются (хотя это встречается, увы, пока очень редко) еще возможности получить доступ в Internet не через ее прямых распространителей, без лишних затрат.

Первый - поищите в публичных библиотеках: некоторые (центральные) имеют службу, называемую Freenet - свободная (бесплатная) сеть. Это информационная система, основанная соответствующим сообществом, обычно имеющая модемный доступ к Internet по телефону.

Второй путь полезен для молодых людей, проживающих в странах Запада, или в центральных городах у нас. Станьте студентом, поступите в западный или организованный у нас же в России совместно с Западом университет или колледж. И выберите соответствующую специальность или запишитесь на курсы, которые позволят вам добраться до заветного компьютера, имеющего доступ в Internet. Например, научитесь плести лапти - уже потом вам будет чем развлечься, когда у вас от непрерывной работы в сети поедет крыша. И когда вы научитесь, у вас будет еще один довод начальству в пользу предоставления вам доступа в Internet: сети как воздух необходима база данных с инструкциями по плетению лаптей, без них они как без рук. Такой вклад руководство не сможет не оценить по достоинству.

4. Из чего состоит Internet?

Это довольно сложный вопрос, ответ на который всё время меняется. Пять лет назад ответ был прост: Internet – это все сети, которые, взаимодействуя с помощью протокола IP, образуют «бесшовную» сеть для своих коллективных пользователей. Сюда относятся различные федеральные сети, совокупность региональных сетей, университетские сети и некоторые зарубежные сети.

В последнее время появилась заинтересованность в подсоединении к Internet сетей, которые не используют протокол IP. Для того чтобы предоставлять клиентам этих сетей услуги Internet, были разработаны методы подключения этих «чужих» сетей (например, BITNET, DECnets и др.) к Internet. Сначала эти подключения, названные шлюзами, предназначались просто для пересылки электронной почты между двумя сетями, но некоторые из них выросли до возможности обеспечения и других услуг на межсетевой основе. Являются ли они частью Internet? И да и нет – всё зависит от того, хотят ли они того сами.

В настоящее время в сети Internet используются практически все известные линии связи от низкоскоростных телефонных линий до высокоскоростных цифровых спутниковых каналов. Операционные системы, используемые в сети Internet, также отличаются разнообразием. Большинство компьютеров сети Internet работают под ОС Unix или VMS. Широко представлены также специальные маршрутизаторы сети типа NetBlazer или Cisco, чья ОС напоминает ОС Unix.

Фактически Internet состоит из множества локальных и глобальных сетей, принадлежащих различным компаниям и предприятиям, связанных между собой различными линиями связи. Internet можно представить себе в виде мозаики сложенной из небольших сетей разной величины, которые активно взаимодействуют одна с другой, пересылая файлы, сообщения и т.п.

5. Кто управляет Internet?

Во многих отношениях Internet похожа на религиозную организацию: в ней есть совет старейшин, каждый пользователь сети может иметь своё мнение о принципах её работы и принимать участие в управлении сетью. В Internet нет ни президента, ни главного инженера, ни Папы. Президенты и прочие высшие официальные лица могут быть у сетей, входящих в Internet, но это совершенно другое дело. В целом же в Internet нет единственной авторитарной фигуры.

Направление развития Internet в основном определяет «Общество Internet», или ISOC (Internet Society). ISOC – это организация на общественных началах, целью которой является содействие глобальному информационному обмену через Internet. Она назначает совет старейшин, который отвечает за техническое руководство и ориентацию Internet.

Совет старейшин IAB (Internet Architecture Board или «Совет по архитектуре Internet») представляет собой группу приглашённых лиц, которые добровольно изъявили принять участие в его работе. IAB регулярно собирается, чтобы утверждать стандарты и распределять ресурсы (например, адреса). Internet работает благодаря наличию стандартных способов взаимодействия компьютеров и прикладных программ друг с другом. Наличие таких стандартов позволяет без проблем связывать между собой компьютеры производства разных фирм. IAB несёт ответственность за эти стандарты, решает, нужен ли тот или иной стандарт и каким он должен быть. Если возникает необходимость в каком-нибудь стандарте, IAB рассматривает проблему, принимает этот стандарт и объявляет об этом по сети. Кроме того, IAB следит за разного рода номерами (и другими вещами), которые должны оставаться уникальными. Например, каждый компьютер Internet имеет свой уникальный 32-х разрядный адрес; такого адреса больше ни у одного компьютера нет. Как присваивается этот адрес, решает IAB. Точнее, сам этот орган присвоением адресов не занимается, он устанавливает правила присвоения адресов.

У каждого пользователя в Internet имеется своё мнение относительно того, как должна функционировать сеть. Пользователи Internet выражают свои мнения на заседаниях инженерной комиссии IETF (Internet Engineering Task Force). IETF – ещё один общественный орган; он собирается регулярно для обсуждения текущих технических и организационных проблем Internet. Если возникает достаточно важная проблема, IETF формирует рабочую группу для дальнейшего её изучения. (На практике «достаточно важная» означает, как правило, что находится достаточно добровольцев для создания рабочей группы.) Посещать заседания IETF и входить в состав рабочих групп может любой; важно, чтобы он работал. Рабочие группы выполняют много различных функций – от выпуска документации и принятия решений о том, как сети должны взаимодействовать между собой в специфических ситуациях, до изменения значений битов в определённом стандарте. Рабочая группа обычно составляет доклад. Это может быть либо предоставляемая всем желающим документация с рекомендациями, которым следовать не обязательно, либо предложение, которое направляется в IAB для принятия в качестве стандарта.

6.Кто платит?

Старое правило для запутанных ситуаций гласит: «ищите денежный интерес». Это правило, однако не годится для Internet. Никто за неё не платит; нет никакой компании Internet, Inc. или другой, подобной ей, которая бы собирала со всех пользователей Internet взносы. Здесь каждый платит за свою часть. Национальный научный фонд платит за NSFNET, НАСА – за NASA Science Internet т т.д. Представители сетей собираются и решают, как соединяться и как финансировать эти взаимные соединения. Колледж или корпорация платит за подключение к региональной сети, которая, в свою очередь, платит за доступ к Internet поставщику на уровне государства.

То, что Internet – бесплатная сеть, не более чем миф. Каждое подключение к ней кем-то оплачивается. Во многих случаях эти взносы не доводятся до фактических пользователей, что создает иллюзию «бесплатного доступа». Но есть и большое число пользователей, которые хорошо знают, что Internet не бесплатная сеть: многие пользователь вносят ежемесячную или почасовую плату за доступ к Internet с домашних компьютеров по линиям со скоростью до 56 Кбайт в секунду (так же, как в базовых сетях). В настоящее время наиболее быстро растёт число пользователей Internet, относящихся к таким категориям, как малые предприятия и частные лица, а они очень хорошо знают цену своим деньгам.

Существует несколько видов оплаты за услуги пользования сетью Интернет:

· оплата за трафик (т.е. за количество скаченной/отправленной информации),

· почасовая оплата,

· абонентская плата.

Некоторые провайдеры требуют дополнительной оплаты за факт подключения, поддержание почтового ящика.

Подробнее рассмотрим наиболее распространенное в малом бизнесе модемное подключение.

В данном случае пользователям можно дать такие рекомендации:

· Выбирая одного из провайдеров, сравните предлагаемые ими наборы услуг;

Подписавшись на услуги Интернет, пользователь обычно получает у провайдера:

· Номер телефона для соединения с провайдером;

· Пользовательское

· IP адрес сервера.имя;

· Пароль;

2.2. Возможности использования ресурсов сети INTERNET

1.Электронная почта

2. Отправка и получение файлов

3.Чтение и посылка текстов

4.Поиск информации (browsing - беспорядочное чтение)

5.Удаленное управление

6.Возможность разговаривать со многими людьми с помощью IRC

7. Игры через INTERNET

Возможности INTERNET

Существует 7 основных путей использования INTERNET:

1. Электронная почта. С помощью почтовых программ Outlook Express и Netscape Messenger

2. Отправка и получение файлов с помощью FTP (File Transfer Protocol)

3. Чтение и посылка текстов в USENET

4. Поиск информации через GOPHER и WWW (World Wide Web)

5. Удаленное управление - запрос и запуск программ на удаленном компьютере.

6. Chat-разговор с помощью сети IRC и Электронной почты

7. Игры через INTERNET

Программы Outlook Express, GOPHER, Netscape Messenger, обеспечивающие отдельные функции INTERNET, называются "клиентами". Они удобны в использовании и предоставляют дружественный интерфейс для пользователей INTERNET. Системы WWW, FTP требуют знания

операционной системы UNIX.

1.Электронная почта

Электронная почта – наиболее простая и зачастую самая полезная. Многие пользователи Internet имеют дело исключительно с электронной почтой, и все равно считают ее бесценным ресурсом. Вы можете отправлять сообщения одному или нескольким людям, пересылать текстовые файлы, получать информацию от автоматизированных компьютерных программ и т.д. Несмотря на то, что никто не откажется иметь полный доступ к Internet, бывают случаи, когда для удовлетворения самых насущных информационных потребностей вполне хватает одной электронной почты.

Не так давно шлюзы для электронной почты были единственной формой доступа к Internet, предоставлявшейся крупными коммерческими диалоговыми системами. В те дни многими овладела захватывающая идея: работать с Internet через электронную почту.

Выполнение этой задачи позволило бы получать реальные сетевые услуги, включая работу с WAIS, Gopher и World Wide Web, не имея ничего, кроме почтового ящика.

Но нельзя недооценивать электронную почту в своей простейшей форме; это средство для обмена сообщениями или использования списков почтовой рассылки для людей, интересующихся общей тематикой. Если использовать электронную почту ежедневно, переписываясь с людьми, живущими на соседней улице или другом полушарии, то через месяц или два вы будете удивлены, как же вы раньше так долго могли обходиться без нее. По иронии судьбы в начале существования ARPANET электронная почта считалась незначительным приложением к тем возможностям, которые предоставляла сеть. Никто не ожидал возникновения огромного потока информации, появившегося в тот период, когда ученые стали обмениваться своими идеями с территориально отделенными коллегами. Сегодня наличие электронной почты воспринимается как нечто само собой разумеющееся всеми – от небольших компаний с офисными сетями до гигантских корпораций, имеющих свои отделения по всему миру. Таким же стремительным был рост электронной почты в коммерческих сетях, многие абоненты которых пользуются только этой услугой.

2. Отправка и получение файлов

Перемещение файлов между компьютерами – одна из самых лучших возможностей, которые мы получили благодаря сетевой революции. Если вы можете отыскать что-то полезное, и если это, как тысячи компьютерных файлов в Internet, - общедоступная информация, то вы можете скопировать это на ваш компьютер. Средство, благодаря которому стал возможен этот процесс, называется протоколом передачи файлов (file transfer protocol), или FTP. Доступ к общедоступным материалам осуществляется через процедуру под названием анонимный FTP. Эта процедура позволяет вам регистрироваться на удаленных компьютерах и использовать источники информации в каталогах, открытых для общего доступа администраторами систем.

Поиск программ в Internet с помощью FTP – непростая задача. Вместо того чтобы запросить каталог всех файлов объединенной библиотеки, как это происходит в America Online, вы сталкиваетесь с тысячами компьютерных архивов, предлагающих программы и текстовые файлы. Чтобы легко находить информацию нужно использовать инструменты поиска. С их помощью мы сможем находить программы, затем с использованием FTP загружать их в собственный компьютер.

3. Чтение и посылка текстов

USENET – это сеть информационных серверов. В Usenet порядка 200.000 конференций (это каталог, куда стекаются сообщения на определенную тему), практически на любую тему отведена своя собственная группа. Сервера постоянно обмениваются между собой информацией, в результате происходит естественно обновление новостей.

4. Поиск информации (browsing - беспорядочное чтение)

Пользователь ищет информацию в INTERNET либо с какой-либо целью, либо просто осматривается вокруг, чтобы знать, что есть в наличии. Море информации представлено в INTERNET, так что можно потратить огромное количество времени, просто переходя c одного сайта на другой и определяя, какая информация имеется в наличии. Эффект взрыва произвело появление таких средств управления поиском информации как GOPHER и WWW. GOPHER использует систему меню, чтобы позволить пользователям осуществлять выбор информации. WWW использует метафору web - паутина, т.к. эта система позволяет свободно перемещаться внутри системы, построенной на основе гипертекста (НТТР).

5. Удаленное управление

Эта возможность очень полезна, когда при выполнении некоторой работы на маленьком компьютере, требуются ресурсы больших систем. Существуют несколько различных типов удаленного исполнения. Некоторые из них работают на основе команд, подаваемых шаг за шагом. Таким образом, запрос заключается в том, чтобы некоторая специфическая команда или их последовательность были выполнены на некотором компьютере. Более развитые версии будут сами выбирать систему и компьютер, которые будут к тому моменту свободными. Существует также удаленный вызов процедуры, который позволяет программе запускать подпрограмму на другом компьютере и затем использовать результат ее работы.

6. Возможность разговаривать со многими людьми с помощью IRC

IRC (Internet relay chat)- это связка крупных сетей (Efnet, Dalnet, Undernet и др.), в каждой из которых сотни chat’ов и десятки тысяч пользователей. Официальный отсчет истории IRC ведется с 1988 года. Именно тогда финский студент Джако, некоторое время, поговорив на многолинейных BBS’ках, задался целью создать нечто похожее, но более глобального масштаба. Тогда и появилась первая сетка IRC – Efnet.

7. Игры через INTERNET

Ни для кого уже не секрет, что игры занимают значительную часть жизни других людей. Играть можно против компьютера (интересно, но не очень), против одного противника (человека) с помощью модема и можно играть против многих противников с помощью локальных сетей или INTERNET. Сейчас существует много серверов, которые предназначены исключительно для игр таких как: Quake, Quake II, Team Fortress, Warcraft II, Starcraft и множество других. Для того чтобы качество игры было приемлемым необходимо обеспечить стабильную и высокоскоростную связь с INTERNET.

2.3. Практическая работа №1. Поиск определенной информации в WWW.

WWW - система для работы с гипертекстом. Потенциально она является наиболее мощным средством поиска. Гипертекст соединяет различные документы на основе заранее заданного набора слов. Например, когда в тексте встречается новое слово или понятие, система, работающая с гипертекстом, дает возможность перейти к другому документу, в котором это слово или понятие рассматривается более подробно.

Гипертекст - текст со вставленными в него словами (командами) разметки, ссылающимися на другие места этого текста, другие документы, картинки и т.д. Во время чтения такого текста (в соответствующей программе, его обрабатывающей и выполняющей соответствующие ссылки или действия) вы видите подсвеченные (выделенные) в тексте слова. Если наехать на них курсором и нажать клавишу или на кнопку (глаз) мышки, то высветится то, на что ссылалось это слово, например, другой параграф той же главы этого же текста. В WWW по ключевым словам можно попасть в совершенно другой текст из другого документа, войти в какую-нибудь программу, произвести какое-либо действие и т.д.

Поиск информации в Интернете

Основная задача Internet – предоставление необходимой информации. Чтобы найти нужную информацию необходимо знать адрес Web-страницы, на которой эта информация находится.

Лучше всего искать в Сети необходимую информацию с помощью поисковых систем. Поисковая система представляет собой специализированный Web-узел. Поисковые системы классифицируют по методам поиска.

Поисковые каталоги предназначены для поиска по темам. Обычно они построены по иерархическому принципу, т.е. каждый шаг поиска это выбор подраздела с более конкретной тематикой искомой информации. На нижнем уровне поиска пользователь получает относительно небольшой список ссылок на искомую информацию.

Поисковый индекс обеспечивает поиск по заданным ключевым словам. Обычно ключевые слова вводятся при заполнении специальной формы поиска, после чего нажимается кнопка Поиск. В результате поиска формируется набор гиперссылок на Web-страницы, содержащий указанные термины. Обычно поисковые индексы выдают огромное количество искомых страниц.

В этом списке представлены ссылки на различные Web-страницы, причем ссылки располагаются по степени убывания встреченных на данных страницах слов, совпадающих с ключевыми словами. При просмотре списка необходимо выбрать те страницы, которые нужно просмотреть. Некоторые системы составляют список ссылок по степени свежести страниц, другие же - по степени вероятности того, что данные страницы окажутся искомыми. Вычисление вероятности основывается на данных о том, как скоро на странице встречается искомое слово. Первыми в таком списке идут ссылки на те страницы, у которых ключевые слова встречаются уже в названии.

Поисковые каталоги предоставляют доступ к меньшему количеству страниц, чем поисковые индексы, но они точнее указывают на основные ресурсы Сети. Поэтому при первичном поиске информации целесообразно использовать поисковые каталоги. А квалифицированным пользователям Internet более полезны поисковые индексы. Они позволяют разыскать малоизвестные и узкоспециализированные ресурсы.

Многие современные поисковые системы сочетают в себе оба указанных метода.

Программа Internet Explorer 5.0 имеет специальные средства организации поиска без явного обращения к поисковым системам. Можно получить доступ к одной из известных поисковых систем, просто щелкнув на кнопке Поиск броузер Internet Explorer.

Если в Internet Explorer щелкнуть по кнопке Поиск, слева появится окно поиска. Далее можно набрать ключевые слова для поиска и выбрать поисковую систему. Результаты поиска будут отражены в правой части окна обозревателя. Если выбрать нужную ссылку, то в правом окне появится содержимое выбранной страницы. Чтобы скрыть окно поиска, необходимо щелкнуть на кнопке Поиск еще раз.

При работе с Internet Ехр1orer можно проводить поиск прямо в поле Адрес. Для этого в адресную строку вводиться слово или фраза для поиска. Под адресной строкой откроется окно со словом Поиск: и искомой фразой.

Internet Explorer начнет поиск с использованием заранее определенной системы поиска; при этом кнопка Поиск на панели инструментов нажмется сама.

Можно осуществить поиск нажав кнопку Пуск и выбрав опцию меню Найти, а затем в Интернете. Окно Internet Explorer откроется само с уже нажатой кнопкой Поиск.

Если удалось найти то, что искали, но все же не совсем то, то в этом случае пригодится механизм связанных ссылок. Для любой Web-страницы можно просмотреть список ссылок, имеющих к ней отношение, возможно, среди них окажется как раз то, что нужно. Чтобы просмотреть связанные ссылки, нужно сделать следующее. Необходимо выбрать в меню Сервис команду Показать связанные ссылки.

После этого на панели инструментов нажать кнопку Поиск, и в левой части экрана полнится окно, содержащее список ссылок, связанных с данной страницей. Нужно щелкнуть на одной из ссылок, и просмотреть в правом окне соответствующую Web-страницу. Чтобы скрыть окно поиска, необходимо щелкнуть еще раз на кнопке Поиск.

Практическая работа № 1.

Тема: Поиск определенной информации в WWW.

Цель: Научиться находить определенную информацию в Интернете.

Для просмотра и поиска информации в Интернете можно воспользоваться браузером Internet Explorer. Чтобы его запустить выполните следующие действия: Пуск→ Программы→ Internet Explorer.

После запуска программы на экране появиться окно Internet Explorer – начальная страница.

Яndex, Aport – самый быстрый поиск web-страниц по какой-нибудь теме. Лучше всего искать информацию через русские поисковые серверы, например, Яndex, Aport, Rambler(http://www.rambler.ru).

Для поиска определенной информации выполните следующие действия:

1. В программе Internet Explorer в поле адрес введите http://www.rambler.ru после чего Explorer загрузит начальную страницу.(рис.1)

2. Введите в поле Поиск название темы и щелкните Найти. Все адреса, обнаруженных страниц с вашей темой, будут отражены на следующей web-странице. Дальше перемещаясь по страницам и адресам, выбирайте нужную информацию.

Практическая работа № 2.

Тема: Использование электронной почты.

Цель: Научиться создавать почтовые сообщения в программе Outlook Express.

Электронная почта

Для того чтобы иметь возможность обмениваться письмами по электронной почте, пользователь должен стать клиентом одной из компьютерных сетей. Также как и в телефонных сетях, клиенты компьютерных сетей называются абонентами.

Для каждого абонента на одном из сетевых компьютеров выделяется область памяти - электронный почтовый ящик. Доступ к этой области памяти осуществляется по адресу, который сообщается абоненту, и паролю, который абонент придумывает сам. Пароль известен только абоненту и сетевому компьютеру. Став абонентом компьютерной сети и получив адрес своего почтового ящика, пользователь может сообщить его друзьям, знакомым. Каждый абонент электронной почты может через свой компьютер и модем послать письмо любому другому абоненту указав в послании его почтовый адрес. Но сделать это можно, только сообщив компьютерной сети свой почтовый адрес и пароль (как доказательство того, что это действительно абонент).

Все письма, поступающие на некоторый почтовый адрес, записываются в выделенную для него область памяти сетевого компьютера. Сетевой компьютер, содержащий почтовые ящики абонентов носит название хост компьютера (от host - хозяин). Существуют два основных типа электронной почты. Первый способ, называется off-line (вне линии, вне связи, произносится: офлайн), заключается в том, что при каждом сеансе связи компьютера абонента с сетевым компьютером происходит обмен письмами в автоматическом режиме: все заранее подготовленные письма абонента передаются на сетевой компьютер, а все письма, пришедшие на адрес абонента, передаются на его компьютер. Название off-line подчеркивает тот факт, что сам процесс ознакомления с письмами и их чтение происходит, когда связь с сетевым компьютером уже прекращена.

Второй способ, названный, естественно, on-line (на линии, на связи, произносится: онлайн), заключается в том, что абонент во время сеанса связи со своего компьютера получает возможность обратиться к содержимому своего почтового ящика, просмотреть его и прочитать письма. Некоторые письма можно удалить не читая, на другие письма можно сразу дать ответ, воспользовавшись клавиатурой своего компьютера. Можно также послать все заготовленные заранее письма, являющиеся ничем иным как текстовыми файлами. В режиме on-line абонент не пользуется автоматическим режимом, а отсылает все письма сам, указывая их адреса и задавая соответствующую команду сетевому компьютеру.

Один компьютер может обслуживать нескольких абонентов. В случае использования on-line сети, каждый абонент осуществляет связь с компьютерной сетью и выполняет необходимые манипуляции для получения или отправки информации в соответствии со своими задачами во время сеанса связи.

Для абонентов сети off-line существует возможность иметь отдельный почтовый ящик на одном компьютере. Каждый абонент пользуется только своим почтовым ящиком, а рассылка и получение писем, связь с телеконференциями и обращения к базам данных для всех абонентов, пользующихся данным компьютером, осуществляются автоматически в момент сеанса связи с компьютерной сетью. Такая сложная организация обмена информацией с использованием одного компьютера приводит к необходимости выделения специального администратора для координации всего обмена информацией, осуществления сеансов, связи и обнаружения заблудившихся писем.

Адресация

Адрес электронной почты, так же как и обычный почтовый адрес должен содержать всю необходимую информацию для того, чтобы письмо дошло до адресата из любой части земного шара. Точно так же, как и почтовый, электронный адрес состоит из двух частей:

раздел "Куда" - содержит указание на хост компьютер;

раздел "Кому" - содержит учетное имя абонента.

В разных системах используются различные способы представления адреса. Например, в системе INTERNET и совместимых с ней разделы "Кому" и "Куда" разделены знаком "@", причем слева указывается "Кому". Например,

user@adonis.iasnet.ru,

где user - учетное имя абонента, а adonis.iasnet.ru - имя хост компьютера (adonis) и указание, как его найти. Раздел "Куда" имеет иерархическую структуру. Уровни иерархии называются доменами (domain - владение, сфера деятельности) и разделены точками. Количество доменов в адресе, вообще говоря, не ограничено. Самый правый домен представляет собой домен верхнего уровня. В данном случае, ru - код России. Для всех стран существуют двухбуквенные коды. Например :

· au - Австралия,

· br - Бразилия,

· by - Беларусь,

· ca - Канада,

· cn - Китай,

· de - Германия,

· jp - Япония,

· ua - Украина,

· uk - Великобритания,

· us - США.

Домен верхнего уровня не обязательно является кодом страны. Ниже приведены примеры нескольких доменов верхнего уровня, используемых в США:

· COM - коммерческие организации и бизнес;

· EDU - образовательные учреждения;

· NET - структурные организации системы;

· ORG - неприбыльные организации;

· INT - международный домен.

Домен второго уровня дает уточнение для поиска хост компьютера. Это может быть код города или региона, в США - штата. В нашем случае домен второго уровня указывает на компьютерную сеть Института Автоматизированных систем (iasnet).

Конверт

Для того чтобы написанное вами письмо добралось до адресата, надо поместить его в конверт, написать адрес и отправить по почте. Адресат, получив письмо, помимо своего адреса обнаружит на конверте некоторые дополнительные данные, которые могут оказаться полезными.

Если на конверте указан обратный адрес, то он может оказаться единственной возможностью для обеспечения отправки ответа. Штемпели почтовых отделений покажут даты прохождения письма через эти учреждения.

По аналогии с конвертом каждое письмо, приходящее по электронной почте снабжено "шапкой", имеющей тот же смысл. В зависимости от того, какая телекоммуникационная система используется, структура адреса может выглядеть по-разному.

Структура электронного послания в системе INTERNET выглядит следующим образом:

From: User Name <user@adonis.iasnet.ru>

Date:2, November 1998 14:25

To: user1@adonis .iasnet.ru

Cc: user2@adonis.iasnet.ru

Bcc: user3@adonis.iasnet.ru

Subject: Hello

Первая строка сообщает адрес и имя отправителя. Строка, начинающаяся с Date, содержит дату и время, когда послание было отправлено. Далее указывается адрес получателя. В строке начинающийся с Сс указывает адрес, которому посылается копия письма. В следующей же строке указывается адрес пользователя, которому оправляется, невидимая для адресата, копия письма. Таких строк может быть несколько или не быть ни одной. В следующей строке указывается содержание письма, его заголовок (иногда так делается и с обычными письмами, например в случае, когда организация требует помечать направляемые в нее письма, некоторым кратким сообщением, например, "На конкурс"). В предпоследней строке указывается идентификатор послания, его уникальный номер. Если это письмо послано в ответ на некоторое другое письмо, то номер этого исходного письма указывается в последней строке. Для первоначальных, инициативных писем эта строка отсутствует.

Однако точный порядок строк шапки послания может меняться от системы к системе. Кроме того, в шапку могут добавляться дополнительные строки, например, Importance - важность послания. Указанный в примере состав шапки послания является обязательным, так как все его компоненты существенны для правильной доставки послания.

Для работы с электронной почтой необходимы специальные почтовые программы. Почтовые программы входят в состав широко распространенных коммуникационных пакетов, например,Outlook Express входит в Microsoft Internet Explorer

Запустите программу Outlook Express: Пуск→Программы→Outlook Express. После запуска программы появится окно, которое состоит из трех частей.(рис.1)

В левой части окна находится перечень папок, в которых хранится корреспонденция:

Входящие – содержит получаемые адресатом письма;
Исходящие - содержит отправляемые адресатом письма, с момента их создания и до момента их доставки с локального компьютера пользователя на почтовый сервер провайдера;
Отправленные - содержат все письма, доставленные на почтовый сервер;
Удаленные – содержит удаленные письма;
Черновики – содержит заготовки писем.

.рис1

Правое окно разделено на две части. В верхней части высвечивается содержимое выделенной папки. В нижней части правого окна показано содержание выделенного сообщения.

Создание почтового сообщения.

Рис.2

1. В строке меню выберите команду Сообщение → Создать. Появится окно.(рис.2) В поле Кому необходимо указать электронный адрес адресата, например: user1@mail.ru. В поле Копии: можно указать адреса получателей копии сообщения. В поле Тема указывается тема сообщения,

например: «Пробное сообщение».

рис.3

2. В области, отведенной для сообщения, введите текст сообщения, например: «Привет! Это пробное сообщение»

3. Для вставки файла в сообщение выберите команду Вставка → Вложение файла…

Рис.4

В появившемся окне Вставка вложений выберите нужный файл, и он будет вставлен в сообщение. Можно также вставлять звуковые и графические файлы. Название вложенного файла появится в нижней части окна сообщения (рис.4).

4. Нажмите кнопку Отправить, и сообщение будет помещено в папку Исходящие.

5. Для того чтобы отправить сообщение адресату, необходимо подключиться к Интернету и нажать

кнопку Доставить почту.

Произойдет соединение с почтовым сервером и передача всех сообщений, находящихся в папке Исходящие на локальном компьютере, на почтовый сервер. Одновременно, доставленные сообщения будут перемещены на локальном компьютере в папку Отправленные.

Вопросы.

1. Из скольких частей состоит окно программы Outlook Express?

2. Назовите папки находящиеся в левой части окна? Их назначение.

3. Какие команды меню необходимо выполнить для создания почтового сообщения и вставки файла в сообщение?

3. ОСНОВЫ WEB-ДИЗАЙНА.

3.1. WEB-дизайн. Основные понятия.

Что такое Web-дизайн?
В чем заключается цель интерактивного Web-дизайна?
Советы по графическому дизайну узла

4. Хостинг и публикация вашего сайта.

WWW - World Wide Web (Интерактивная мультимедийная гипертекстовая среда, использующая язык разметки и поддерживающая множество протоколов Интернета). Всемирная паутина появилась на свет в 1992 году. Она была создана Тимом Бернерсом-Ли из Европейского центра ядерных исследований (CERN), расположенного в Женеве (Швейцария)

Что такое Web-дизайн?
Это графический дизайн, перенесенный в интерактивную среду. Он по сути своей ближе всего подходит к полиграфии. Но несмотря на то, что эти стили графического дизайна визуально чем-то напоминают друг друга, технология их создания различна как две вселенные. Это понятно, так отличается специфика каждой области дизайна.

В чем заключается цель интерактивного Web-дизайна?
Главная цель графического дизайна со спецификой заточенной под интерактивную, интерфейсную среду - помочь пользователю быстро интуитивно сориентироваться на выбранном им сайте. Как и любая другая область дизайна, он должен выполнить основные правила дизайна, применяемые к проектируемому предмету, в данном случае к интерфейсу, т.е. сделать его красивым, полезным, простым, приятным в использовании и т.д. Web-дизайнер, проектируя сайт, стремится добиться того, чтобы максимально точно адаптировать цель проекта к потребностям предполагаемого пользователя, т.е. максимально упростить юзеру работу с сайтом и сделать эту работу удобной, полезной и приятной. При посещении сайта юзер, по замыслу web-дизайнера, должен найти ресурс в общем - полезным, а в частности - приятным визуально и простым и понятным в использовании. Дизайн сайта должен оставить у пользователя хорошие впечатления, это очень важно, чтобы привлечь пользователя в следующий раз.

C точки зрения маркетинга не стоит забывать, что изделие, имеющее товарный вид, всегда выглядит "вкуснее" аналогичного изделия без оформления, т.е. графический дизайн определенно может изменить восприятие реальности, даже когда реальность остается той же самой.

Web-дизайн, в отличие от полиграфии, уже не оформление изделия, не незначительная и дополнительная его часть, а суть само изделие. Проектируя сайт, web-дизайнер создает полноценный продукт, а не оформляет его. И поэтому роль дизайна в web-проекте является главенствующей, а web-дизайнер выступает в роли создателя изделия. Отсюда следует, что web-дизайн является сутью интернет-проектов, а значит и сутью самого Интернета.

Сайты в большинстве своем проектируются для посетителей и только для них (исключение составляют персональные проекты, которые оформляются исключительно по своему вкусу).
Сайт должен быть близок, понятен и соразмерен пользователю. И обязательно визуально приятен. И по возможности необычен, интригующ и загадочен. Люди, как известно, любят получать неожиданные хорошие впечатления и переживания.
В идеале web-дизайнеру надо стремиться предугадать желания определенной группы пользователей, которые обязательно посетят сайт в силу специфики самого сайта.
Посещение сайта для пользователя должно быть подобно празднику!

И переживания, полученные от посещения сайта должны быть запоминающимися и поразительными. А в основе проекта удачного праздника лежат два правила. Никогда не увлекайтесь чрезмерной продуманностью сценария, всегда должно остаться место для творчества самого пользователя. И, во вторых, полное отсутствие сценария - это тоже катастрофа. Идеальный сценарий web-проекта должен сочетать в себе "подготовку и спонтанность".
Как уже говорилось, стиль оформления проекта следует подбирать исходя из того, кто предположительно посетит проект.
Интернет будет таким, каким его сделает web-дизайнер.

Советы по графическому дизайну узла

Основные правила графического дизайна узла можно разбить на четыре основных категории:

Последовательность
Графические примитивы
Привлекалки (в английском это называется callouts)
Цветовая гамма

Последовательность

Последовательность в графическом наполнении узла заключается в том, что документы, составляющие узел, должны быть достаточно похожи, чтобы напоминать посетителю друг о друге. Конечно, они не должны быть идентичными. Следование правилу последовательности направлено на достижение следующих результатов:

она показывает, что вы затратили некоторые усилия для соблюдения последовательности
она демонстрирует профессиональное отношение к дизайну узла
она помогает посетителям ориентироваться в гиперпространстве
она помогает восприятию

Существует несколько готовых к употреблению средств для создания последовательного дизайна. Они включают в себя:

использование цвета (подробнее ниже)
стилизация списков, таблиц, меню, ссылок и т.п.
использование шапок и концевиков страниц

Шапки и концевики страниц

Многие известные узлы имеют последовательные концевики. В них расположены ссылки на авторские права, почтовые адреса, которые, как правило, отделены от остальной страницы. Точно так же многие узлы имеют последовательные шапки. Это достигается:

следованием определенному стилю в заголовках
вставкой логотипа
использованием разделителей и линеек
вставкой основного меню

На самом деле способов гораздо больше, но и этого вам вполне хватит.

Графические примитивы

Существует много видов графических примитивов, используемых для достижения последовательности узла. Ими являются:

разделители
иконки
элементы оформления

Разделители

Даже стандартный разделитель можно изменить различными способами - ширину, толщину или цвет.

Иконки

Можно загрузить иконки с одного из многих архивов бесплатной графики, но лучше создать их самому (если у вас, конечно, есть дар художника). При этом необходимо помнить, что:

иконки должны быть символичными - вести к функции, которую они отображают, иначе они бесполезны.

если вы пользуетесь бесплатной графикой, следите за тем, чтобы они были последовательными, похожими друг на друга и соответствующими выбранному вами стилю

Элементы оформления

Элементы оформления - это специальные картинки, используемые для форматирования документа. Ими могут быть маркеры (bullets), разделители параграфов или страниц.

Привлекалки

Привлекалки - это графические средства привлечения внимания к определенным типам информации. В HTML существует много способов создания привлекалок. Основным видом привлекалок, поддерживаемым всеми браузерами, является... гиперссылка.

Привлекалки могут создаваться различными способами:

оформление цветом
использование strong, bold, emphasized или italicized
пространственное разделение

Хостинг и публикация вашего сайта.

Хостингом называется аренда дискового пространства на реальном сервере с реальным IP адресом.

Существует несколько способов опубликовать вашу информацию в Интернете. Первый и самый простой - воспользоваться тем дисковым пространством, которое провайдер предоставляет бесплатно (большинство провайдеров при подключении через них бесплатно дают 5-10 Мб). Для "домашней странички", прайс-листа и тому подобных вещей этого места вполне хватит. Есть только один минус - адрес такой странички будет выглядеть как-то вроде http://www.dux.ru/guest/newbe/index.html. Запомнить, продиктовать по телефону или перепечатать набранный на визитке подобный адрес довольно сложно. Кроме того, вместо того, чтобы рекламировать вашу фирму или говорить о вашем хобби такой адрес, в первую очередь, рекламирует вашего провайдера... Это не означает, что пользоваться такими адресами нельзя - они вполне годятся для многих нужд. Как бумага в клеточку вырванная из тетради. На ней удобно делать пометки для себя, написать записку жене и т.п., но вот использовать ее для "фирменных" писем как-то не принято...
Следующая возможность - это создание "домена третьего уровня". Выглядит такой адрес как "http://ваше имя.provider.ru" и значительно легче запоминается, диктуется и т.п. Домены третьего уровня довольно часто можно получить бесплатно или за очень маленькие деньги все у того же провайдера или на каком-нибудь сервере, предоставляющем бесплатный хостинг, например, на chat.ru.
Кстати, вопрос о том, что предпочесть: бесплатный Web-хостинг или хостинг у вашего провайдера тоже имеет некоторое значение. По большому счету, у бесплатного хостинга преимущество только одно: ваш адрес не будет меняться при смене провайдера. Это достаточно важно, т.к. в большинстве случаев ваши посетители находят вас через поисковые системы или глядя на визитку, которую вы дали, может быть, год назад. Если за это время вы сменили провайдера, то потенциальный посетитель увидит сообщение о том, что "документ не найден" и пойдет к вашим конкурентам. Однако бесплатные хостеры тоже хотят кушать, поэтому в качестве платы за предоставление места требуют от вас разместить их баннеры на своих страницах или даже размещают их автоматически. Кроме того, бесплатный хостер не гарантирует непрерывную работу - в любой момент он может "закрыться на ремонт", что-то поменять в конфигурации и т.п. Уже не говоря о том, что выкладывать файлы к своему провайдеру намного проще - соединение с сервером почти прямое и, соответственно, наиболее быстрое. Тут стоит подумать о редиректорах. Это такая штука, которая автоматически "перебрасывает" вашего посетителя с одного адреса на другой. Есть специальные службы, которые этим занимаются, например da.ru или attend.to. Зарегистровавшись в такой службе и указав ваш текуший адрес вы сможете публиковать свой адрес в виде http://attend.to/ваше_имя или http://ваше_имя.da.ru и пользователь будет автоматически перенаправлен на ваш текущий адрес. А при смене провайдера вам надо будет всего-лишь зайти на сайт и изменить свой текущий адрес.
Дальнейшее развитие сайта требует регистрации собственного "домена второго уровня", при котором ваш адрес в Интернете выглядит как www.ваше_имя.ru Это делается тоже сравнительно несложно и недорого - типичная стоимость это 35 долларов в год за регистрацию имени и 10 долларов в месяц за место на диске и поддержание сервера. При этом при переходе к другому провайдеру ваш адрес сохраняется, просто данные физически переносятся на другой сервер. В абсолютном большинстве случаев для такого хостинга достаточно виртуального сервера (это когда на одном компьютере расположено несколько сайтов с разными именами), но если ваш сайт будет слишком большим или "излишне популярным", то через некоторое время придется задуматься о собственном выделенном сервере. По большому счету, разница между виртуальным и выделенным сервером не очень велика и проявляется только в том случае, если вам надо делать что-то относительно нестандартное, например, запускать долгоработающие или сильно загружающие процессор скрипты. Кроме того, плюсом выделенного сервера является то, что вы получаете над ним полный контроль - в любой момент вы можете доставить те программы, которые вам нужны, изменить конфигурацию и т.п. Правда, абсолютному большинству сайтов это не требуется...
Все сказанное выше - это теория, в которой, как обычно, все гладко. Теперь немного практики.
Физическое расположение сервера имеет довольно существенное значение, особенно если ваш сайт занимает много места. Чем ближе к вам расположен сервер, тем быстрее связь и тем проще его обновлять. Если же сервер расположен с вами в одном городе, то в случае крупных обновлений вы сможете банально приносить данные на винчестере. Скорость связи с сервером можно посмотреть с помощью команды ping, а "расстояние" с помощью команды tracert. Обе эти команды уже есть в Windows, а открыв окно ДОС и набрав "ping /?" или "tracert /?" вы узнаете как ими пользоваться.
Эти же данные влияют и на то, насколько удобно будет вашим пользователям смотреть ваш сайт. Поэтому стоит оценить какие пользователи для вас приоритетны (по географическому положению) и размещать сервер так, чтобы для них он был "поближе". Например, если вы орентируетесь на "буржуев", то имеет смысл и хостинг организовывать там же, тем более, что цены везде примерно одинаковы.
При смене провайдера имеет смысл договариваться с ним о том, чтобы несколько месяцев он подержал на вашем старом адресе страничку с извещением о том, что вы "переехали" и с новым адресом. Можно и автоматический редирект сделать, это легко прописывается в META тэге странички. Следует учитывать и то, что изменится и ваш почтовый адрес. Здесь - то же самое, договоритесь о перенаправлении почты. Это. разумеется, будет стоить каких-то денег, но "непотеря" клиентов их окупит.
При выборе хостера стоит не полениться и посмотреть разные варианты. Обязательно поинтересуйтесь возможными ограничениями на трафик (количество переданных/принятых данных), на размер сайта, на загрузку сервера (например, многие провайдеры ограничивают максимальное время выполнения скрипта и суммарное время выполнения всех ваших скриптов) и т.п. Узнайте, можно ли устанавливать свои скрипты, предоставляет ли хостер набор готовых CGI, какие программы и языки установлены на сервере, есть ли telnet доступ, можно ли заводить собственные домены третьего уровня, можно ли заводить собственные почтовые ящики и сколько, автоответчики и т.п. Спрашивая про ограничения трафика и услышав "неограничено" в ответ, поинтересуйтесь что значит "неограничено" и какой цифрой оно выражается. Если же ограничения есть, то узнайте сколько будет стоить их превышение. Учтите, что те вещи, которые сейчас вам кажутся незначительными, например, наличие базы данных или поддержка PHP могут вам понадобится довольно скоро - сайт-то будет развиваться и захочется чего-то нового... А смена хостера в реальной жизни - это как минимум неделя нервотрепки и неустойчивой работы сервера…

3.2 Рекомендации по компьютерному дизайну.

1. Эффективность оформления определяют факторы, которые способствуют успешной реализации любого сложного художественного проекта: продуманный до мелочей план, профессионально выполненный
дизайн и соответствующее оборудование.

2. Чтобы разные типы информации не смешивались друг с другом, можно использовать эффект контраста. Для усиления контраста можно
использовать противопоставление по нескольким признакам (цвет, шрифт, композиция, фактура и т.д.).

3. Разумно используйте цвет (цветовой контраст, тональность, оттенки). Не стремитесь к излишнему усложнению: иногда прекрасное заключается в простом.

4. Нужно определиться с характером и стилем программы (серьезная или шутливая, вычурная или доступная для всех). Как правило, характер и концепция оформления предопределена стилем самого текста и иллюстраций.

5. В самом начале работы необходимо принять одно из самых важных решений - какой шрифт использовать. Обратите внимание на три фактора: отличная "читабельность", соответствующий стиль и максимальная функциональность.

6. Не следует прибегать к какому-то особому выделению текста, делая упор на оригинальность шрифта и его необычность, совершенно не придавая значение тому, что мелкие буквы и объемные текстовые блоки затрудняют восприятие.

7.Эффекты, привлекающие внимание (мелькание, повышенная яркость, обратный контраст, звуковые эффекты), следует применять осторожно.

8. Необходимо минимизировать количество цветов, используемых на экране одновременно.

9. Цвет переднего плана и цвет фона должны находиться в сочетании между собой и с цветом тех символов, которые должны быть выделены на экране. При демонстрации с компьютера на экране телевизора желательно использовать темный цвет фона.

10. Не рекомендуется использовать яркие цвета для границ окон и для заголовков.

Весьма существенным фактором, который следует учитывать при создании композиции, является размер.

В дизайне нет понятия абсолютного размера, а есть лишь относительный, кажущийся размер. Соотношение важных и не важных частей определяет компактность формы, сильно влияющую на ее воспринимаемый размер. На восприятие размера влияет симметрия формы: симметричные фигуры кажутся более компактными и меньшими по размеру, чем равновеликие им несимметричные.

Поскольку понятие "воспринимаемого размера" тесно связано с понятием "заметности" элемента, вполне естественно, что цвет может активно влиять на эту характеристику. Чем контрастней цвет элемента на фоне его окружения, тем он заметнее кажется больше. Например, белое пространство признается одним из сильнейших средств выразительности, малогарнитурный набор - признаком стиля.

Ярко выраженная текстура обычно применяется лишь к нескольким центральным элементам композиции с целью их акцентирования и должна вызывать увеличение субъективного размера. Любая текстура усложняет облик предмета, делает его неоднородным, что также подталкивает подсознание к 'растягиванию' воспринимаемого объекта. Геометрические текстуры обладают эффектом 'раздувания' форм, что объясняется их большей регулярностью, предсказуемостью и высокой визуальной плотностью.

3.3 Рекомендации по подготовке текста.

Не форматируйте текст в процессе его создания. Помните о том, что форматирование осуществляется в процессе верстки.

Правила, которым необходимо следовать при наборе текста:

1. После точки, запятой, двоеточия, знаков вопроса и восклицания ставьте только один пробел.

Не вводите пустую строку между абзацами.

Текст любого абзаца начинайте вводить с левой границы колонки даже в том случае, если его в дальнейшем следует разместить в центре,
сместить вправо или влево.

Внутри абзаца отдельные слова или группу слов можно выделять с использованием подчеркивания, курсива, полужирного начертания, но не применяйте это ко всему абзацу в целом.

5. Для создания простых таблиц лучше пользоваться табуляцией, поскольку в файл вставляется код табулятора, а не совокупность пробелов.

6. Гарнитуры с засечками легче воспринимаются читателем и способствуют лучшему пониманию прочитанного.

7. Чрезмерно крупный размер шрифта затрудняет процесс беглого чтения.

8. Ориентация текстовой информации на экране дисплея должна быть вертикальной.

9. Расстояние между строками должно быть больше, чем высота символов (текстовую информацию лучше представлять через строку).

10. При проектировании длины строк следует учитывать возраст испытуемых (например, для пользователей - дошкольников и младших школьников желательны более короткие строки).

При выборе шрифтов для вербальной информации следует учитывать следующее:

- прописные буквы воспринимаются тяжелее, чем строчные;

-лучше воспринимаются цифры, образованные прямыми линиями; Любой шрифт - как и любая форма и любой цвет - имеет свою тональность, настроение.

Если необходимо использовать шрифты нескольких размеров, то лучше всего ограничиться одним шрифтом с засечками и одним рубленым. Введение в композицию третьего шрифта возможно, только если есть очень серьезные причины.

Шрифты с засечками лучше всего использовать для печатных изданий, а шрифты без засечек лучше смотрятся на экране компьютера.

Наиболее хорошо воспринимаемые сочетания цветов шрифта и фона: белый на темно-синем, лимонно-желтый на пурпурном, черный на белом, желтый на синем.

3.4 Рекомендации по использованию цветовой палитры.

Давно было замечено что различные цвета по разному действуют на человека. Мы вполне допускаем что цвет, который нравится одному, совсем не понравится другому. И вместе с тем замечено что некоторые цвета являются общими для создания определенных эмоциональных состояний человека. Это не будет обязательным для всех, есть и исключения. Здесь и ниже мы будем ориентироваться на большинство.
Нам важно так создать оформление сайта, чтобы оно благоприятно влияло на отношение посетителя к сайту:

Мы будем использовать оттенки синего, голубого, насыщ. желтого, оранжевого, белого, зеленого.

На некоторые цвета у большого количества людей преобладает негативная реакция:

Черный, Красный, Серый, Коричневый, эти цвета при доминировании на сайте вызовут отрицательную оценку сайта.

При умелом сочетании цветов влияние негативной составляющей этих цветов можно нивелировать(пример: Синий-черный) или даже превратить в плюсы. Того эффекта зачастую можно достичь при плавных переходах цветов.

Также все зависит от того какую атмосферу вы хотите создать на своем сайте, если сайт посвящен фильмам ужасов, смело используйте гаммы черного, серого, коричневого и красного цветов. Если же вы хотите чего-то другого то обратите внимание на позитивные и ресурсные цвета.

Помните, что во многом отношение к сайту зависит от тех цветов, которые вы используете при его оформлении.

Элементы восприятия играют также большую роль при оформлении сайта.

Считается, что одновременно глаз человека может воспринимать около 7±2 однотипных элементов.

В нашем частном случае, пункты меню сайта будут как раз именно такими элементами. Именно поэтому наиболее эффективным меню будет состоять из 5-7 пунктов. Максимум(не оптимум) из 9. Такое количество ссылок в меню позволит пользователю быстро привыкнуть и запомнить меню вашего сайта, что является одним из признаков, что вероятно он станет постоянным посетителем сайта. Выходом из данной ситуации вполне может стать разбивка элементов меню на несколько семерок ссылок. Выделение некоторых ссылок другим шрифтом(цветом) также улучшит ситуацию.

• С помощью зрительных ощущений человек может различать до 180 цветовых тонов и большое число их оттенков - 20 оттенков белого
цвета и до 40 - черного. Декоративные возможности цвета и его сочетаний практически не ограничены. Ощущение различных цветов
может вызывать у людей впечатление тепла или холода, хорошего или плохого настроения. Восприятие того или иного цвета может
возбуждать или успокаивать

• Выбор цветовой палитры является одним из важных аспектов создания интерфейса. В выборе цветовой палитры должны быть

учтены эргономические требования: значения цветов должны быть постоянны и соответствовать устойчивым ассоциациям. Ощущение времени и пространства, наибольшее чувство удаления от предмета (увеличение пространства) создают цвета сине-голубой части спектра, а противоположные им оранжево-желтые тона дают эффект приближения предметов; цвета красно-желтой части спектра
вызывают ощущение тепла, цвета сине-голубой части спектра - ощущение холода, максимум ощущения тепла падает на оранжевый цвет. Основное свойство "теплых" цветов - вызывать возбуждение, они стимулируют интерес человека к внешнему миру, общению и деятельности. «Холодные» цвета вызывают торможение. Это успокаивающие и снимающие возбуждение цвета, они вносят в поведение человека рассудочность, рациональность. Наибольшее возбуждающее действие оказывает красный цвет, воспринимающийся также как самый активный. Визуальное равновесие приходится на зеленый цвет, сочетающий в себе легкость и живость желтого со спокойствием и тяжестью синего. При совмещении активных и пассивных цветов нужно учитывать, что активные цвета всегда воспринимаются ярче и лучше запоминаются, поэтому для достижения равновесия они должны подаваться в меньших пропорциях. Цвета сине-голубой части хроматического круга считаются наиболее тяжелыми для восприятия. Желтый цвет, наоборот, выглядит наиболее легким и воздушным. Очень хорошо гармонируют полярные цветовые таблицы, когда они сочетаются на сером фоне или в разных плоскостях. Серый - нейтральный цвет. Он не привлекает к себе внимания, не вызывает никаких реакций, создает ощущение стабильности.

Итак, при проектировании персонального сайта, презентаций, обучающих программ рекомендуется учитывать следующие физиологические особенности восприятия цветов и форм:

1. Стимулирующие (теплые) цвета способствуют возбуждению и действуют как раздражители (в порядке убывания интенсивности воздействия): красный, оранжевый, желтый.

2. Дезинтегрирующие (холодные) цвета успокаивают, вызывают сонное состояние (в том же порядке): фиолетовый, синий, голубой,
сине-зеленый, зеленый.

3. Нейтральные цвета: светло-розовый, серо-голубой, желто-зеленый, коричневый.

4. Сочетание двух цветов - цвета знака и цвета фона – существенно влияет на зрительный комфорт, причем некоторые пары цветов не
только утомляют зрение, но и могут привести к стрессу (например, зеленые буквы на красном фоне).

5. Составление цветовой схемы обучающей программы начинается с выбора трех главных функциональных цветов, которые используются
для представления обычного текста, гиперссылок и посещенных

4. СОЗДАНИЕ WEB-СТРАНИЧКИ.

4.1.Создание простых Web-страниц.

Знакомство с программой FrontPage.

Программа FrontPage, входящая в состав пакета Microsoft Office, рассчитана в первую очередь, не на создание отдельных Web-страниц, а на сопровождение полноценного Web-узла. Она содержит средства контроля структуры узла, единства оформления, правильности внутренних и внешних гиперссылок. Средства создания страниц, рассматриваемые в этом пособии,- это всего лишь небольшая и не основная часть возможностей этой программы. Начиная работу в редакторе FrontPage, следует отдавать себе отчет, что в результате его применения получается документ HTML, построенный по тем же правилам, что и создаваемый вручную. Этот факт сразу же определяет возможности и ограничения в работе этого редактора.
• Все функции редактора FrontPage однозначно реализуются тегами HTML.
• Редактор FrontPage не имеет средств, которые нельзя было бы представить в виде тегов HTML.
• Пользователь обычно не знает, какие именно средства HTML используются для достижения заданного эффекта и насколько корректно применяются.
Редактор FrontPage «ориентирован» на применение браузера Internet Explorer, так что создаваемый им код HTML наиболее адекватно отображается именно в этом браузере. В частности, FrontPage позволяет использовать «бегущую строку», средство, которое не входит в стандарт HTML, но поддерживается Internet Explorer.

Начало и завершение работы.

Запуск программы FrontPage

Для запуска программы FrontPage нужно нажать на кнопку Start (Пуск) на панели задач Windows. Если вы установили программу FrontPage в составе пакета Office XP, выберите пункт Programs (Программы), а затем — пункт Office и иконку Microsoft FrontPage . Если вы установили

FrontPage как отдельную программу, выберите пункт Programs, затем щелкните по иконке Microsoft FrontPage.

После запуска FrontPage на экране появится пустое главное окно. Теперь вы можете создать новую страницу или Web-сайт либо открыть уже существующую страницу или Web- сайт.

Выход из программы FrontPage

После сохранения выполненной работы (Ctrl+S) выберите в меню пункты File - Exit (Файл - Выход) или нажмите клавиши Alt+F4.

Режимы просмотра Normal, HTML и Preview.

Вы можете пользоваться одним из трех режимов просмотра. Выбрать режим можно при помощи какой-либо из трех кнопок: Normal (устанавливается по умолчанию), HTML или Preview. Режим просмотра Normal позволяет напрямую редактировать текущую Web-страницу. При этом HTML-кодировка скрыта (см. рис.3). В режиме просмотра HTML вы будете видеть всю кодировку и сможете менять ее (см. рис.4). Режим просмотра Preview позволяет увидеть, каким образом страница будет выглядеть в Web-браузере.

Рис.3 рис.4

справочка

Для переключения режимов вы также можете использовать клавиши Ctrl+ Page Up или Ctrl+Page Down, переходя в восходящем или нисходящем порядке от режима Normal к HTML и Preview. Теоретически режим Preview должен работать аналогично команде браузера Preview (File - Preview в браузере). Однако на практике некоторые вещи (например, текст с эффектом скроллинга) будут выглядеть одинаково. Другие эффекты (например, анимационные показы слайдов) не будут отображаться в режиме Preview, их можно просмотреть только с помощью команды. Поэтому рекомендуем вам пользоваться командой File - Preview в браузере.

Меню.

рис.5
Меню, которые расположены в верхней части главного окна FrontPage(рис.5), остаются неизменными независимо от ваших действий. Однако некоторые меню, например Frames (Фреймы), могут использоваться только при условии, что вы работаете с Web-страницами, на которых есть фреймы.
Меню File
При помощи команд в меню File (Файл) можно выполнять различные действия: создавать, открывать, закрывать, сохранять, размещать и импортировать Web-страницы или сайты. Меню File также позволяет задавать настройки печати, изменять общие установки программы FrontPage и выходить из программы.
Меню Edit
Большинство команд в меню Edit (Правка) работают так же, как в других программах, за исключением пятого раздела меню. В нем вы можете задавать параметры проверки Check In/Check Out system, которые позволят избежать конфликтов версий файлов в том случае, если с Web-сайтом работает несколько пользователей.
Меню View
Большинство команд в меню View (Вид) повторяют те команды, которые выполняются при помощи кнопок на панели видов. Пункт меню Toolbars (Панели инструментов) позволяет включить или выключить любую из 12 панелей инструментов FrontPage.
Меню Insert.
Как понятно из названия, это меню предназначено для вставки в Web-страницы любой информации от разрывов строк, дат и гиперссылок до команд Java или компонентов Office XP или Office 2000, например диаграмм и таблиц.
Меню Format.
При помощи команд в меню Format (Формат) можно изменять внешний вид текста, адреса HTML, а также так называемые темы FrontPage, определяющие общий дизайн вашего Web-сайта.
Меню Tools.
Меню Tools(Сервис) позволяет изменять многие из настроек программы FrontPage. Оно также предоставляет допуск к словарю и тезаурусу программы FrontPage.
Меню Table
В меню Таblе (Таблица) находятся команды, необходимые для добавления таблиц в страницу или изменения расположения строк или столбцов.
Меню Frames
Вы можете работать с командами в меню Frames (Фреймы) только в том случае, если вы открыли Web-страницу, в состав которой входят HTML-фреймы . Страницы с фреймами создаются при помощи команды New Page (Создать страницу) или клавиш Ctrl+N.
Меню Window
Программа FrontPage позволяет одновременно открывать несколько Web-страниц и сайтов. Меню Window (Окно) служит для быстрого переключения от одного окна к другому . Вы также можете это делать при помощи вкладок страниц в главном окне FrontPage.
Меню Help
Это меню имеется в любой программе Windows. Оно предоставляет доступ к системе справочной информации программы FrontPage .

Как создавать, открывать, сохранять и закрывать Web-страницы

Для построения Web-страницы вы можете воспользоваться одним из трех способов: создать черновик новой страницы и сохранить его, создать новую страницу на основе шаблона или открыть существующую, изменить ее и сохранить под новым именем с помощью команды Save As(Сохранить как).

Создание Web-документа.

Ввод и форматирование текста. Создание и редактирование документа

Окно программы FrontPage представляет собой комбинацию окна редактора и окна браузера. Документ HTML отображается редактором, как специфическим браузером, отображающим даже обычно невидимые элементы (такие как якоря). В тоже время, этот текст можно редактировать средствами, аналогичными имеющимся в текстовом процессоре. Когда текст достигает правого края экрана, курсор автоматически перемещается на одну строку вниз. Указатель также используется для выделения текста, который затем можно перемещать, копировать и вырезать.

В HTML- кодировке изменить шрифт слова с обычного на полужирный довольно непросто. Программа FrontPage позволяет менять стиль отображения текста также легко, как и в текстовых редакторах. Следует лишь выделить текст и нажать на кнопку Панель инструментов Форматирование.
Она содержит:
• Раскрывающийся список Стиль, позволяющий выбрать стиль оформления абзаца (соответствующий стандартным функциональным элементам HTML);
• Раскрывающийся список Шрифт, позволяющий выбрать гарнитуру шрифта;
• Раскрывающийся список Размер, позволяющий управлять размером текста;
• Кнопки выбора начертания;
• Кнопки выбора выравнивания теста (с помощью атрибута Align= в теге абзаца < P);
• Кнопки создания маркированных (неупорядоченных) и нумерованных (упорядоченных) списков;
• Кнопки задания отступа текста (на основе некорректного использования элементов HTML);
• Кнопки задания рамок и цвета шрифта и фона. Эти функции реализуются с помощью списков стилей, которые рассматриваются как расширение HTML.
Дополнительные элементы форматирования, не вынесенные на панель инструментов, задаются в отдельных диалоговых окнах. Их можно открыть, например, с помощью команд Формат – Шрифт и Формат - Список.

Практическое задание.

Создайте свою Web-страницу в программе FrontPage.

Задание1 Запуск программы FrontPage

1. Нажмите на кнопку Start (Пуск) на панели задач Windows. Если вы установили программу FrontPage в составе пакета Office XP, выберите пункт Programs (Программы), а затем — пункт Office и иконку Microsoft FrontPage. Если вы установили FrontPage как отдельную программу, выберите пункт Programs, затем щелкните по иконке Microsoft Front Page.
2. После запуска FrontPage на экране появится пустое главное окно. Теперь вы можете создать новую страницу или Web-сайт либо открыть уже существующую страницу или Web- сайт.

Выход из программы FrontPage

После сохранения выполненной работы (Ctrl+S) выберите в меню пункты File -> Exit (Файл - Выход) или нажмите клавиши Alt+F4

Задание2. Создание новой пустой Web-страницы

1. Выберите команды меню File --> New --> Page or Web либо щелкните мышью по кнопке New Page (Ctrl+N)
2. Если вы выбрали команды меню File -> New -> Page or Web, то справа в главном окне программы появится область задач. Щелкните по гиперссылке Blank Page (Пустая страница) ,—чтобы создать пустую страницу. После щелчка по кнопке New Page на первом шаге сразу появится пустая страница. Здесь вы можете написать что угодно.

Задание3. Как открыть существующую Web-страницу

1. Выберите команды меню File --> Open или щелкните мышью по кнопке Open (Открыть), или нажмите клавиши Ctrl+O.
2. После появления диалогового окна Open File (Открытие файла) перейдите к тому файлу, который нужно открыть, и выполните двойной щелчок мышью, либо введите его имя в поле File Name (Имя файла) и нажмите на кнопку Ореn.
3. В главном окне программы FrontPage будет открыта выбранная вами страница.

(Справочка)

Чтобы произвести в диалоговом окне Open File поиск файлов определенного типа, пользуйтесь ниспадающим меню Files of Туре (Тип файлов). Если открыта область задач, вы можете выбрать один из пунктов в меню Open а Раgе (Открыть страницу), которое включает в себя список нескольких недавно открытых Web-страниц.

Задание4. Сохранение Web-страницы

1.Выберите команды меню File --> Save As.
2.После появления диалогового окна Save As щелкните по кнопке перехода, чтобы перейти в директорию, в которой следует сохранить страницу .
3.В диалоговом окне Save As нажмите на кнопку Change (Изменить), чтобы задать название страницы . Когда появится диалоговое окно Set Page Title (Укажите заголовок страницы), введите то название, которое Web-браузеры будут показывать как заголовок страницы, и нажмите на кнопку ОК.
4. По умолчанию имя файла будет основано на первой строке текста в файле. Если вы желаете назвать файл по-другому, задайте другое имя в текстовом поле File Name. Введите после названия файла расширение .htm, затем нажмите на кнопку Save (Сохранить). Файл будет сохранен с тем названием, которое вы ему дали. (В) Если вы не зададите название для вашей Веб-страницы при сохранении, программа FrontPage сгенерирует название на основании первой строки текста. Затем с этим заголовком будут работать все Web-браузеры.

Задание5. Сохранение Web-страницы под другим названием

1. Выберите команды меню File –>Save As.
2. После появления диалогового окна Save As перейдите в директорию, где следует сохранить файл, затем нажмите на кнопку Save, чтобы дать странице новое имя . После появления диалогового окна Set Page Title введите название страницы, которое будет отображаться в браузере, и нажмите на кнопку ОК.
3. Введите имя файла в поле File Name и нажмите на кнопку Save. Файл будет сохранен под новым именем.

Как закрыть Web-страницу

После сохранения страницы выберите команды меню File --> Close (нажмите клавиши Ctrl+F4) или щелкните по кнопке с крестиком в верхнем правом углу страницы. Закроется только Web-страница, а программа FrontPage будет работать по-прежнему, и вы сможете открыть другую страницу или работать над решением других задач.

Задание6. Вставка рисунка

1. Переключитесь в режиме просмотра страницы с помощью кнопки Page на панели видов, затем щелкните мышью по странице в месте предполагаемой вставки рисунка.
2. Выберите пункт меню Insert ->Picture, а затем – в подменю пункт ClipArt или From File.
3. Если вы выбрали пункт ClipArt, то в правой части главного окна появиться область задач Insert ClipArt. Для поиска рисунка пользуйтесь полем Search text и кнопкой Search. Щелкните по названию файла в области задач, и рисунок добавиться в Web-страницу. Если вы выбрали пункт From File, появиться диалоговое окно Picture. Пользуясь кнопками Look in или кнопками Навигации, чтобы найти рисунок. Нажмите на кнопку Insert, чтобы поместить его на страницу.
4. Сохраните страницу вместе с новым рисунком (нажмите клавишу Ctrl +S). Если вы использовали рисунок, который находился не на текущем Web-сайте, появится диалоговое окно Save Embedded Files(Сохранить внедренный рисунок).
5. Если вы хотите изменить имя файла, нажмите на кнопку Rename.Чтобы сохранить файл по адресу, щелкните по кнопке Change Folder(Сменить папку). Затем нажмите на кнопку ОК.
6. после сохранения рисунок можно отредактировать. Для этого щелкните правой кнопкой мыши по рисунку на Web-странице и выберите пункт меню Picture Properties. На вкладке Appearance можно задать параметры обтекания текстом, добавить к рисунку границы, установить свободное пространство вокруг рисунка. В разделе Size можно задать размеры рисунка.

4.2.Создание гиперссылок и гиперсвязей.

Гиперссылки.

Гиперссылка (иногда называют просто ссылкой) - это связь, ведущая с одной страницы на другую страницу. Различают локальные ссылки. указывающие на ресурс внутри текущего Web-узла, и внешние, указывающие на любой ресурс находящийся где угодно в Интернете. Различаю также абсолютные (жестко прописанные) и относительные (ссылающиеся в пределах текущей папки) ссылки. Для страниц, располагаемых в Интернете, подходят только относительные ссылки.

Одним из основных преимуществ при работе в Internet является возможность перехода от одного файла к другому посредством одного щелчка мышью. Эта возможность реализована при помощи гиперссылок. Для создания гиперссылки надо выделить фрагмент текста, который будет использоваться как ссылка, и дать команду Вставка – Гиперссылка. В открывшемся диалоговом окне Добавление гиперссылки тип гиперссылки выбирают на панели Связать с. Можно выбрать для ссылки другой файл (Связать с файлом, веб-страницей), место в этом же документе (Связать с местом в документе), новую страницу своего веб-узла (Связать с новым документом; документ на который указывает ссылка, создается немедленно) или адрес электронной почты (Связать с электронной почтой). Кнопки Выбор рамки и Закладка позволяют указать, соответственно, имя фрейма, в котором будет открываться страница, и якорь, который необходимо использовать. Созданная гиперссылка отображается в окне программы FrontPage так же, как и в окне браузера: синим цветом с подчеркиванием. Чтобы проверить работоспособность ссылки, следует щелкнуть на ней правой кнопкой мыши и выбрать в контекстном меню команду По ссылке.

Использование закладок.

Закладки позволяют быстро переходить в нужные разделы на больших Web-страницах, например, к заголовкам. Создание закладок состоит из двух шагов: сначала вы создаете саму закладку, затем гиперссылки, которые на нее указывают. Закладка может располагаться на текущей или любой другой странице. При помощи закладок можно перемещаться по странице без необходимости просматривать весь документ. Закладки необязательно должны относиться к заголовкам. Можно создавать ссылку на фразу, слово, рисунок и даже на один символ.

Ссылки на рисунки.

Конечно, Internet не ограничен только текстовыми ссылками. С помощью FrontPage можно легко добавлять любые ссылки на рисунок: ссылку между всем рисунком и файлом или так называемую горячую область, которая соединяет файл и определенную область рисунка. Используя несколько таких областей, вы можете создавать ссылки на несколько файлов.

Практическое занятие 2

Задание1. Создание ссылки на внешнюю страницу.

1.Перейдите в режим просмотра страницы при помощи кнопки Page на панели видов.
2.Выделите текст, который вы желаете использовать для ссылки.
3.Выберите пункты меню Insert --> Hyperlink или нажмите на кнопку Hyperlink на Стандартной панели инструментов. Вы также можете щелкнуть по странице правой клавишей мыши и выбрать в меню пункт Hyperlink.
4.После появления диалогового окна Insert Hyperlink выделенный вами текст появиться в поле Text to display. Вы можете изменить этот текст по своему усмотрению.
5.Выберите кнопку Link to (Связать с), затем кнопку Existing File or Web Page (С существующим файлом или Веб-страницей).
6.Если вы знаете URL-адрес сайта, введите его в текстовом поле Address(Адрес) и перейдите к пункту 9. Если адрес вам неизвестен, нажмите на кнопку поиска в браузере, чтобы найти нужную страницу.
7.После запуска браузера, установленного по умолчанию, перейдите к той внешней Web-странице, ссылку на которую требуется создать.
8. Переключитесь обратно в диалоговое окно Insert Hyperlink , и URL-адрес страницы будет автоматически вставлен в текстовое поле Address(Адрес).

Задание2. Создание ссылки на страницу вашего Web-сайта.

1.Перейдите в режим просмотра страницы при помощи кнопки Page на панели видов.
2.Выделите текст, который вы желаете использовать для ссылки, щелкните по нему правой кнопкой мыши и выберите в меню пункт Hyperlink.
3.В появившемся диалоговом окне Insert Hyperlink по умолчанию будет нажата кнопка Existing File or Web Page . С помощью кнопок списка Look in и кнопок браузера отыщите нужный файл на вашем Web-сайте. Щелкните по нему мышью, и его название будет помещено в текстовое поле Address.
4.Нажмите на кнопку OK в окне Insert Hyperlink . Диалоговое окно закройте, выделенный текст буден связан с файлом, и отобразиться на странице в виде текста с подчеркиванием.

Задание3. Создание закладки.

1.Выделите текст, который нужно пометить закладкой, то есть тот текст, к которому при помощи закладки можно перейти.
2.Выберите пункты меню Insert → Bookmark.
3.В открывшемся диалоговом окне Bookmark выделенный текст по умолчанию используется в качестве названия для закладки. При желании вы можете ввести другое название.
4.После ввода названия закладки нажмите на кнопку OK. Созданная закладка будет выделена подчеркиванием пунктирной линией.

Задание 4. Создание ссылки между рисунком и файлом.

1.Активизируйте панель Pictures, выбрав пункты меню View → Toolbars → Pictures.
2.Откройте страницу, на которой находится нужный вам рисунок, и щелкните по нему. Рисунок будет выделен. В его углах появятся черные маркеры изменения размера.
3. Щелкните правой кнопкой мыши по выделенному рисунку и выберите в меню пункт Hyperlink.
4.После открытия диалогового окна Insert Hyperlink вы можете изменить параметры гиперссылок. Чтобы создать ссылку между рисунком и другой страницей текущего Web-сайта, выберите в центральном окне файл и нажмите на кнопку OK. Будет создана ссылка между рисунком и выбранной страницей, что отразится в строке состояния и в строке подсказки.

4.3. Возможности включения фреймов.

Фрейм - это способ представления нескольких Web-страниц в одном окне. Фреймы используют для более легкой навигации по сайту. Неоспоримым достоинством является удобная навигация, а недостатком - при размещении сайта в Интернете, и в частности в индексированных поисковых системах (например, Rambler), отображаться могут не весь набор фреймов, а каждая страничка в отдельности.

Чтобы добавить набор фреймов (страницу фреймов), нужно выполнить команду File → New → Page or Web, в появившемся справа окне выбираем Page Templates → Frames Pages, затем выбираем необходимый фрейм. Если вы просто собираете в единое целое готовые страницы, то в нужном фрейме выбираем Set Initial Page, а если мы только начали работу над сайтом, можно создать новые страницы непосредственно из страницы фреймов, выбрав New Page.

Создание и форматирование фреймов.

Одно из больших преимуществ создания страницы на основе фрейма состоит в том, что можно форматировать навигационные гиперссылки ко всем частям сайта или добавить кнопки, которые остаются видимыми на одном из фреймов даже тогда, когда пользователь прокручивает содержимое основного фрейма. Благодаря этому можно легко ориентироваться на вашем сайте, без труда переходя к разным его частям.

Создание фреймов.

Каждый фрейм может отображать отдельную Web-страницу. Создадите ли вы страницу до или после создания самих фреймов, зависит только от вас. Тем не менее будет меньше путаницы, если сначала сделать макеты страниц, а затем создать фреймы, которые будут содержать эти страницы. После этого обычно формируют гиперссылки фрейма.

Показ фрейма в новом окне.

Щелкните правой кнопкой мыши внутри фрейма и выберите в контекстном меню пункт Open Page in New Windows. Фрейм отобразится в полноэкранном режиме.

Настройка целевых фреймов.

В программе FrontPage наибольший фрейм по умолчанию устанавливается в качестве целевого (target) для гиперссылок, находящихся, например, в левом фрейме-оглавлении. Тем не менее FrontPage позволяет непосредственно определять какой-либо фрейм в качестве адресата гиперссылки

Практические задания.

Задание 1 Создание фреймовой страницы.

1.Перейдите в окно просмотра страницы, затем выберите в меню File→ New→ Page or Web (Файл – Создать – Страница или Web).
2.В появившейся области задач щелкните по ссылке Page Templates(Шаблоны страницы)
3.В открывшемся диалоговом окне Page Templates выберите вкладку Frames Pages(Фреймовые страницы). Используйте область Preview (Предварительный просмотр) диалогового окна, чтобы выбрать шаблоны фреймовой страницы, нажмите кнопку ОК. Появится пустая фреймовая страница, которая в каждом из своих фреймов предлагает два варианта: Set Initial Page (Установить исходную страницу) и New Page(Создать страницу)
4.Чтобы связать фрейм с существующей на вашем Web-сайте страницей, щелкните по кнопке Set Initial Page. В появившемся диалоговом окне Insert Hyperlink(Добавление гиперссылки) – перейдите к той странице, с которой вы будете работать, и нажмите кнопку ОК. Страница появиться во фрейме. Чтобы создать для фрейма новую пустую страницу, нажмите New Page. Внутри фрейма появиться пустая страница. Теперь можно разместить в этом фрейме любую информацию.
5.Сохраните новый фрейм. Если вы создавали новую страницу для какого-либо из фреймов, то фрейм этой страницы будет выделен в области предварительного просмотра диалогового окна Save As(Сохранить как).
6. Дайте новой странице имя и заголовок и нажмите кнопку Save. Новая страница будет сохранена, после чего появиться диалоговое окно Save As для сохранения фреймовой страницы целиком.
7. Дайте фреймовой странице имя и заголовок и нажмите кнопку Save. Фреймовая страница будет сохранена.

Задание2 Установка целевого фрейма для ссылки.

1.Щелкните правой клавишей мыши по гиперссылке, для которой вы хотите установить целевой фрейм и выберите в меню пункт Hyperlink из контекстного меню.
2.Убедитесь, что в поле Address(Адрес) окна Insert Hyperlink задано правильное значение. Если это не так, измените его.
3.Нажмите кнопку Target Frame(Целевой фрейм). Вы увидите в появившемся диалоговом окне Target Frame текстовое поле Target Setting(Установка цели) содержит значение main(главный), так обозначается главный фрейм страницы.
4.Чтобы изменить эту настройку, щелкните по фрейму в миниатюре Current frames page(текущая фреймовая страница) или по пункту списка в окне Common setting.
5.Щелкните по кнопке ОК и в появившемся диалоговом окне Insert Hyperlink снова нажмите ОК.

4.4. Знакомство с HTML.

1.Что такое HTML?

2.HTML как явление нашей жизни

3.История развития

4.Структура языка.

5.Элементам языка HTML.

6.Таблицы.

· Что такое HTML?

Термин HTML (Hyper Text Markup Language) означает "язык маркировки гипертекстов". Это понятие более широкое, включает в себя Интернет и локальные сети, редакторы, браузеры, разнообразные программные продукты, компакт-диски, обучающие курсы, дизайн и многое другое. HTML – своеобразная противоположность сложным языкам программирования, известным только специалистам.

· HTML как явление нашей жизни

HTML давно перестал быть просто языком программирования. Человек, изучавший этот язык, обретает возможность делать сложные вещи простыми способами и, главное, быстро, что в компьютерном мире не так уж и мало. Гипертекст подходит для включения элементов мультимедиа в традиционные документы. Практически именно благодаря развитию гипертекста, большинство пользователей получило возможность создавать собственные мультимедийные продукты и распространять их на компакт-дисках. Такие информационные системы, выполненные в виде набора HTML-страниц, не требует разработки специальных программных средств, так как все необходимые инструменты для работы с данными (WEB-браузеры) стали частью стандартного программного обеспечения большинства персональных компьютеров. От пользователя требуется выполнить только ту работу, которая относится к тематике разрабатываемого продукта: подготовить тексты, нарисовать рисунки, создать HTML-страницы и продумать связь между ними.

HTML является основой моды в Интернете.

HTML, как основа создания WEB-страниц, имеет прямое отношение и к новому направлению изобразительного искусства – WEB-дизайн. Художнику в Интернете недостаточно просто нарисовать красивые картинки, оригинальный логотип, создать новый фирменный стиль. Он должен еще поместить все это в Сети, продумать связь между WEB-страницами, чтобы все двигалось, откликалась на действие пользователя, поражало воображение, вызывало желание создать что-нибудь свое, оригинальное в этой области.

История развития

В 1989 году выпускник Оксфордского университета, бакалавр в области физики - сотрудник Европейского центра ядерных исследований (CERN) Тим Бернес-Ли разработал и всерьез приступил к созданию информационной службы World Wide Web (WWW). Он написал приложение клиент/сервер (браузер). В основу всей системы легло понятие гипертекста, т.е. множества отдельных текстов, имеющих ссылки друг на друга. Для работы с этими текстами был создан специальный протокол HTTP - Hyper Text Transfer Protocol были обозначены основные элементы языка разметки HTML. Эта технология дала огромный толчок в развитии сети, и сеть стала действительно интернациональной сетью.

Язык гипертекстовой разметки HTML (Hyper Text Markup Language) был предложен Тимом Бернесом-Ли в 1989 году в качестве одного из компонентов технологии разработки распределенной гипертекстовой системы World Wide Web. Язык НТМL позволяет определять структуру электронного документа с полиграфическим уровнем оформления; результирующий документ может содержать самые разнообразные теги: иллюстрации, аудио и видео фрагменты и так далее. Язык включает в свой состав развитые средства для специфицирования нескольких уровней заголовков, шрифтовых выделений, различных групп объектов, например, словари, каталоги или меню для размещения иллюстраций и других фрагментов, а также множество других возможностей. Существует несколько версий языка.

В 1993 году появился HTML+ , и эта версия также осталась практически незамеченной. Начало широкого использования гипертекста дала версия HTML 2.0, которая появилась в июне 1994 года. Элементы, включенные в версию HTML 2.0, в большинстве своем используют до сих пор.

В версии HTML 3.0, которая появилась год спустя, была реализована возможность прорисовки математических символов (знаков интервала, бесконечности, дроби, скобок и т.д.) при помощи элементов языка. Под эту версию был разработан браузер Arena. Но этот проект оказался тупиковым и не получил дальнейшего распространения.

В 1996 году появился HTML 3.2. Это было новаторское решение, в спецификацию языка были введены фреймы, которые стали теперь весьма популярны у разработчиков WEB-страниц. Практически все современные браузеры поддерживают версию HTML 3.2, поэтому авторы WEB-страниц уверенны в работоспособности всех элементов. Но новаторское решение – фреймы, не были включены в спецификацию HTML 3.2. Но браузеры поддерживали фреймы и многие книги, посвященные HTML, содержали описание фреймов без упоминания о том, что это нестандартные элементы. В последствии, фреймы стали стандартом де-факто. В версии HTML 4.0 они уже были включены на полном основании.

Официальная спецификация HTML 4.0 (Dynamic HTML) появилась в 1997 году. В это время уже было очевидно, что дальнейшее развитие гипертекста будет осуществляться за счет скриптов - программирования. Появившиеся в то время браузеры (Netscape Navigator 4.0, Microsoft Internet Explorer 4.0 и др.) уже достаточно надежно интерпретировали программный код (был установлен определенный уровень стандартизации). В результате, использование всех возможностей Dynamic HTML стало уделом программистов достаточно крупных организаций, где есть условия для разработки сложных программ и всестороннего их тестирования.

В версиях HTML 1.0, HTML 2.0, HTML 3.0 – таблицы и графика не строятся; HTML 3.2, HTML 4.0 – таблицы и графика строятся и вставляются картинки. Версия HTML 4.0 (называемая Dynamic HTML) поддерживает дополнительные средства работы с мультимедиа, таблицы стилей, разметка математических формул, разбиение страницы на фреймы и т.д.

Структура языка

Второй вопрос посвящен структуре документа HTML. В нём необходимо дать основные структурные теги, которые опускать не рекомендуется:

<HTML> и </HTML> - теги открытия и закрытия документа;

<HEAD> и </HEAD> - теги заголовка, описывающие документ в целом;

<TITLE> и </TITLE> - общий заголовок документа, заключённые между тегами <HEAD> и </HEAD>;

Основное содержание размещается в теле документа, которое ограничивается парным тегом <BODY>.

Правильный простейший документ HTML, содержащий все теги, определяющие структуру, может выглядеть следующим образом:

<HTML>

< HEAD>

<T1TLЕ> Заголовок документа </TITLE>

</HEAD>

<BODY>

Текст документа

</BODY>

</HTML>

Необходимо упомянуть о том, что при написании команд HTML не имеет значения, какими буквами - строчными или прописными Вы запишите команды.

Если данную программу набрать в блокноте и сохранить как документ с расширением .html, то получится следующее:

Рис.1. Создание простейшей Web-страницы

Элементам языка HTML.

Необходимо осветить то где располагаются элементы, блочные и текстовые элементы, правила их вложения.

Для парных тегов область влияния определяется частью документа между открывающим и закрывающим тегом. Такую часть документа рассматривают как элемент языка HTML.

Можно привести примеры. Например, так, можно говорить об «элементе BODY», включающем тег <BODY>, основное содержание документа и закрывающий тег </BODY>. Весь документ HTML можно рассматривать как «элемент HTML». Для непарных тегов элемент совпадает с тегом, который его определяет.

Большинство элементов языка HTML описывает части содержания документа и помещается между тегами <BODY> и </BODY>, то есть внутрь структурного элемента BODY. Такие элементы делят на блочные и текстовые, Блочные элементы относятся к частям текста уровня абзаца. Текстовые элементы описывают свойства отдельных фраз и еще более мелких частей текста.

Правила вложения элементов.

v Элементы не должны пересекаться. Другими словами, если открывающий тег располагается внутри элемента, то и соответствующий закрывающий тег должен располагаться внутри этого же элемента.

v Блочные элементы могут содержать вложенные блочные и текстовые элементы.

v Текстовые элементы могут содержать вложенные текстовые элементы.

v Текстовые элементы не могут содержать вложенные блочные элементы.

Рассмотрим основные элементы HTML.

<HTML></html>

Означает документ на языке HTML. Было уже упомянуто о том, что одним из принципов языка является многоуровневое вложение элементов. Данный элемент является самым внешним, так как между его начальным и коечным тегами должна находится вся WEB – страница. Он имеет атрибуты version, long и dir, которыми в данном случае редко кто пользуется, и допускает вложение элементов HEAD, BODY и других, определяющую общую структуру WEB-страницы. Конечным тегом </html> оканчиваются все документы в формате HTML.

<HEAD></head>

Область заголовка Web – страницы, её первая часть. HEAD служит только для формирования общей структуры документа. Этот элемент может иметь атрибуты IANG, DIR, должен включать элемент TITLE и допускает вложение элементов BASE, META, LINK, OBJECT, SCARIPT, STULE.

<TITLE></title>

Элемент для размещения заголовка Web – страницы. Строка текста, расположенного внутри этого элемента, отображается не в документе, а в заголовке окна броузера. Эта строка часто используется при организации поиска в WWW. Эта строка должна достаточно точно отражать назначение документа.

<BODY></body>

Этот элемент заключает в себе гипертекст, который определяет собственно Web – страницу. Конечный тег этого элемента надо искать в конце HTML-файла. Внутри элемента BODY можно использовать все элементы, предназначенные для дизайна Web-страницы. Внутри начального тега элемента BODY можно расположить ряд атрибутов, обеспечивающих установки для всей страницы целиком.

Атрибут, определяющий фон страницы, является одним из самых важных для дизайна.

background = “Путь к файлу”

Более простое оформление фона сводится к заданию его цвета:

bgcolor = “#RRGGBB”

Цвета фона задается тремя двухразрядными шестнадцатеричными числами, которые определяют интенсивность красного, зеленого и синего. Оба приведенных выше атрибута не являются альтернативными и часто используются совместно: если по каким-либо причинам не может быть найден рисунок фона, используется цвет.

Поскольку фон станицы может изменятся, необходимо иметь возможность подбирать соответственный цвет текста. Для этого имеются следующей атрибут:

text = “#RRGGBB”

Для задания цвета текста гиперссылок используются следующие атрибуты:

link = “#RRGGBB”

Точно так же можно задать цвет для просмотренных гиперссылок:

vlink = “#RRGGBB”

Можно также указать изменение цвета для последней выбранный пользователем гиперссылки:

Alink = “#RRGGBB”

<H1><h1>

Элемент заголовка. Существует шесть уровней заголовка, которые обозначаются H1…H6. Заголовок уровня 1 самый крупный, а уровень 6 обеспечивает самый маленький заголовок. Для заголовков могут использовать атрибуты, задающие выравнивание влево, по центру или вправо:

align = “left”

align = “center”

align = “right”

<P> </P> - описывает абзац. Все, что заключено между <P> и </P>, воспринимается как один абзац. Можно данный тег <P> не закрывать тегом </P>.

<BR> - перейти на новую строку, не прерывая абзаца, т.е. принуждённый переход на новую строку.

<HR>

Горизонтальная линия – очень часто используемый элемент. Во-первых, потому что с его помощью очень удобно делить страницу на части.

Во-вторых, потому что выбор подобных элементов оформления у автора страницы очень небольшой. Этот элемент не имеет конечного тега, но допускает ряд атрибутов для выравнивания влево, по центру, вправо, по ширине:

align = “left”

align = “center”

align = “right”

align = “justify”

Можно задать толщину линии:

Size = толщина в пикселях

Можно управлять длиной линии:

width = длина в пикселях

width = длина в процентах

Можно выбрать цвет:

color = “цвет”

<A></a>

HTML-документ может быть очень большим, и в этом случае нужно иметь возможность быстрого перемещения к нужному разделу документа. Для этого можно использовать механизм гиперссылок. Необходимо также в нужных местах текста расставить соответствующие метки. Шаблон для создания меток таков:

<A name = “>Произвольный текст</a>

В данном случае данной строке документа присваивается имя, и, следовательно, в другой части документа или даже на другом документе может быть создана гиперссылка, приводящая в эту точку. Для перехода внутри документа можно использовать следующую конструкцию:

<P>Переход к <A href = “#метка”>метке</a></p>

Несколько подобных строк могут образовать своеобразное оглавление Web-страницы, которое можно разместить в начале и в конце документа.

Таблицы

Концепция таблиц в HTML 3.2

Структура таблиц в HTML включает строки и столбцы, которые могут иметь заголовки. Таблица в обычном варианте представляется в естественном виде, с согласованно расположенными столбцами. Таблицы - важнейшее улучшение в HTML 3.2 по сравнению с HTML 2.0.

Теги, используемые для представления таблиц

Для представления таблиц используются нескольких видов тегов HTML:

теги TABLE, которые обрамляют всю табличную спецификацию
необязательный элемент CAPTION, специфицирующий заголовок (имя) таблицы
теги TR, специфицирующие строки таблицы
теги TH, специфицирующие заголовки строк и столбцов
теги TD, специфицирующие данные в таблице, т.е. содержимое табличных ячеек

Основные табличные структуры

Давайте начнем с очень простого примера. Он связан с представлением таблицы чисел 2 на 2 (единичная матрица) без каких либо заголовков. Код HTML выглядит следующим образом:

<TABLE>

</TABLE>

и обычно представляется браузером следующим образом:

1	0
0	1

Таким образом, теги TABLE заключают в себе табличные строки, каждая из которых обрамляется тегами TR, и табличные ячейки, обрамляемые тегами TD. Это согласуется с логической структурой таблицы, как множеством строк, состоящих из ячеек.

Дополнительные свойства; типичная таблица с текстовыми ячейками

Есть несколько элементов, которые Вы можете добавить к вышерассмотренной простой табличной модели:

Заголовок (caption) для таблицы, связанный с самой таблицей (в дополнение к строкам текста о таблице в документе).
Подзаголовки (headers) (объяснения) как для табличных строк, так и для колонок.
Рамки (borders) вокруг таблицы и каждой табличной ячейки.

Параллельные тексты

Если у Вас есть логически параллельный текст, например, документ на нескольких языках, или несколько вариантов одного текста, элементы TABLE, по-видимому, наилучший способ его представления. (Использование элемента PRE - возможно, но требует утомительного форматирования, в результате которого формируется текст с одноразмерным шрифтом.)

В простейшем случае Вы можете записать элемент TABLE (с атрибутами по умолчанию), который содержит единственную строку с двумя ячейками данных, каждая из которых включает абзац.

В более общем случае Вы должны разделить параллельный текст на логические части (абзацы), и сделать каждую часть ячейкой таблицы. Это может потребовать определенной работы (если у Вас нет соответствующей программы для этого), так как Вы должны уделить внимание правильной последовательности работы с текстом: после первой части первого текста Вы должны работать с первой частью второго текста и т.д.

Практическая работа №4.

На этом занятии вы научитесь создавать свои собственные WEB-страницы. Для начала давайте вспомним основные теги, необходимые для создания Web-документа.

Обязательные теги

<html> ... </html> - открывающий и закрывающий тег документа;

<head> ... </head> - указывает на начало и конец заголовка документа;

<title> ... </title> - отображает название текущего документа, находится между тегами <head> </head>.

<body> ... </body> - указывает на начало и конец тела HTML-документа.

<H1> ... </H1> — <H6> ... </H6> Теги вида <Hi> (где i — цифра от 1 до 6) описывают заголовки шести различных уровней. Заголовок первого уровня — самый крупный, шестого уровня – самый мелкий.

<P> ... </P> - описывает абзац. Все, что заключено между <P> и </P>, воспринимается как один абзац. Можно данный тег <P> не закрывать тегом </P>.

Теги <Hi> и <P> могут содержать дополнительный атрибут ALIGN (читается "элайн", от английского "выравнивать"):

v ALIGN=LEFT - выравниванием по левому краю;

v ALIGN=CENTER - выравниванием по центру;

v ALIGN=RIGHT - выравниванием по правому краю.

<BR> - перейти на новую строку, не прерывая абзаца, т.е. принуждённый переход на новую строку.

<HR> - описывает горизонтальную линию.

Тег может дополнительно включать атрибуты:

v SIZE= - определяет толщину линии в пикселях;

v WIDTH= - определяет размах линии в процентах от ширины экрана;

v ALIGN=LEFT | CENTER | RIGHT –выравнивание по левому краю/ по центру / по правому краю соответственно.

Чтобы создать простейшую WEB-страничку выполним следующий ряд заданий:

Выберем в меню ПУСК→ПРОГРАММЫ→СТАНДАРТНЫЕ → БЛОКНОТ.

рис.1

Перед вами окно БЛОКНОТА, в котором и будет записываться код вашей странички.

рис.2

1. Введите следующий текст:

<html>

<head>

<title>Пример 1</title>

</head>

<body>

<H1 ALIGN=CENTER>Привет!</H1>

<H2>Я создаю свой первый HTML-документ</H2>

<P> Я знаю, что абзац можно выравнивать не только по левому краю,

<P ALIGN=CENTER> но и по центру

<P ALIGN=RIGHT> или по правому краю.

</body>

</html>

2. Сохраните этот документ под именем 1.html в своей папке.

3. Запустите программу, которую вы только что создали.

4. Посмотрите, как отображается этот файл. Где отображается содержимое тега <title>? Где отображается содержимое тега <body>?

5. У вас должна получится такая страничка.(рис.3)

рис.3

В следующем примере приведена небольшая коллекция горизонтальных линий, они выполняются при помощи тега <HR> и его атрибутов SIZE= и WIDTH=.

1. Запустите текстовый редактор Блокнот (Пуск — Программы — Стандартные — Блокнот).

2. Введите следующий текст:

<html>

<head>

<title> Пример 2 </title>

</head>

<body>

<H1 align=center>Моя коллекция горизонтальных линий </H1>

</body>

</html>

3. Сохраните этот документ под именем 2.html в своей папке.

4. Запустите программу, которую вы только что создали. У вас должно получиться следующее (рис.4):

Рис.4

Самостоятельно выполните следующее задание, сохранив его под именем 3.html в своей папке. Используя, изученные теги и их атрибуты получите следующее:

рис.5

4.5. Форматирование текста.

1. Форматирование шрифта (текста)

2. Специальные эффекты (мерцание, бегущая строка)

3. Специальные символы

4. Управление цветом

5. Вставка рисунка.

Управление форматированием текста не является основной задачей языка HTML, и поэтому текстовые элементы, выполняющие эту задачу, начиная с версии 4.0, рассматриваются как устаревшие, и их использование не рекомендуется. Однако они все еще предоставляют удобный способ управления видом документа на экране компьютера.

Парный тег <FONT> позволяет управлять параметрами шрифта. Он должен обязательно содержать хотя бы один из трех атрибутов: COLOR=, FACE= или SIZE=.

Атрибут COLOR= задает цвет текста, который может быть задан текстовым значением (например, COLOR="GREEN") или шестнадцатеричным кодом, в котором последовательные байты задают значения красной, зеленой и синей составляющих цвета (COLOR="#00FF00" дает тот же результат, что и COLOR="GREEN").

Атрибут FACE= задает гарнитуру шрифта. Значение этого атрибута сравнивается с именами шрифтов, которые установлены на компьютере.

Атрибут SIZE= определяет размер шрифта в относительных единицах (от 1 до 7). Для этого атрибута можно определять значение со знаком (плюс или минус), которое определяет увеличение или уменьшение шрифта относительно текущего размера.

Кроме того, можно увеличить или уменьшить высоту шрифта с помощью парных тегов <BIG> </BIG> и <SMALL> </SMALL>.

Еще две пары команд:

<SUB> и </SUB> - подстрочный индекс, например, H₂SO₄.

<SUP> и </SUP> - надстрочный индекс, например, (a²-b²)=(a - b)(a + b).

Начертание символов задается при помощи парных тегов:

v B - жирный (Bold);

v I - курсив (Italic);

v U - с подчеркиванием (Underline);

v S - с перечеркиванием (STRIKE).

Все вышеприведенные команды определяют физическое форматирование символов. Вы задаете конкретное изменение характеристик символов.

Их использование не всегда уместно. Вместо них следует иногда применять элементы фразы, описывающие функциональные особенности текста; например, вместо

<В> Обратите внимание! </В>

лучше написать

<STRONG> Обратите внимание! </STRONG>

Это уже команды логического форматирования символов. Вы даете описание, а браузер решает, как изменять характеристики.

<CITE>	Цитата	</CITE>
<Q>	Текст, заключённый в скобки	</Q>
<EM>	Особо важный текст	</EM>
<STRONG>	Сильное выделение текста	</STRONG>
<KBD>	Текст, введенный пользователем	</KBD>
<CODE>	Листинг программы	</CODE>
<SAMP>	Последовательность литералов	</SAMP>
<VAR>	Имя переменной	</VAR>

Так, парный тег <CITE> предназначен для отображения цитат (выводятся курсивом).

Парные теги <ЕМ> (выделение) и <STRONG> (сильное выделение) являются функциональными аналогами курсивного и полужирного начертаний.

Кроме того, язык HTML содержит набор элементов для описания работы компьютерных программ. Для этой цели используют парные теги <CODE> (исходный текст программы), <KBD> (текст, вводимый с клавиатуры), <SAMP> (пример вывода программы) и <VAR> (программные переменные). Для вывода соответствующих элементов используется моноширинный шрифт. Кроме того, переменные выводятся курсивом, а клавиатурный ввод (в некоторых браузерах) - полужирным шрифтом.

Специальные эффекты

Создание мигающего текста.

Вы можете создать изображение текста мигающим с помощью следующих тегов: <BLINK> и </BLINK>.

Нельзя слишком злоупотреблять мигающим изображением. Его лучше всего применять для привлечения внимания к новой информации в домашней странице.

Замечание: работает в Netscape 3.0, но не работает в Explorer 3.0

Создание бегущей строки

Бегущая строка создается с помощью тегов: <MARQUEE> и <MARQUEE>. По умолчанию текст будет двигаться справа налево медленно.

Атрибут DIRECTION= - определяет направление скроллинга, имеет значения:

v DOWN – движение вниз;

v LEFT – движение справа налево;

v RIGHT – движение слева направо;

v UP – движение вверх.

Атрибут BEHAVIOR= - определяет вид скроллинга, имеет следующие значения:

v ALTERNATE – колебательные движения справа налево и назад;

v SLIDE – текст перемещается один раз и останавливается;

v SCROLL – перемещение текста в направлении, указанном в DIRECTION=. Достигнув края экрана, надпись появляется снова с противоположной стороны.

Команда <MARQUEE BEHAVIOR=“ALTERNATE” SCROLLAMOUNT=“50” SCROLLDELAY=“8”> </MARQUEE> - этот текст

будет двигаться справа налево и назад.

Команда <MARQUEE BEHAVIOR=“SLIDE”> </MARQUEE> - этот текст

будет двигаться и останавливаться.

Команда <MARQUEE SCROLLDELAY=“5” SCROLLAMOUNT=“50” > </MARQUEE> - этот текст будет двигаться очень быстро.

Замечание: данный тег работает в Explorer 3.0, не работает в Netscape 3.0

Специальные символы

В языке HTML символ < используется как первый символ каждого тега. Этот символ не может быть использован для обозначения отношения “меньше”. Для отображения на экране символа < (“меньше”) и некоторых других символов в HTML приняты специальные обозначения:

Отображаемый текст	Запись в формате HTML
<	<
>	>
&	&
“	"
знак пробела

Язык HTML всегда уменьшает количество подряд расположенных пробелов до одного, независимо от того, сколько пробелов было в исходном тексте. Для задания необходимого количества подряд расположенных пробелов следует воспользоваться специальным символом пробела: &nbsp.

Например, в следующей записи исходного текста: (A       B) в отображаемом тексте между символами A и B будет 3 пробела.

Управление цветом

Цвета и изображения фона задаются с помощью команды <BODY>.

Эта команда может задаваться только в начале HTML файла и не может быть изменена в дальнейшем. Ее параметры:

v bgcolor = “# код цвета” - цвет фона документа,

v text = “# код цвета” - цвет текста документа,

v link = “# код цвета” - цвет текста, используемого в качестве ссылки,

v vlink = “# код цвета” - цвет ссылки на просмотренный ранее документ,

v alink = “# код цвета” - цвет ссылки в момент нажатия на нее правой кнопки мыши.

Код цвета задается в кодировке RGB - шесть шестнадцатеричных чисел.

Важно отметить, что цвет фона не отображается на бумаге при выводе HTML-документа на печать. Ниже приводятся коды простейших цветов:

Белый = FFFFFF	Малиновый = FF00FF
Желтый = FFFF00	Бирюзовый = 008080
Красный = FF0000	Темно-синий = 000080
Серый = 808080	Коричневый = 808000
Синий = 0000FF	Голубой = 00FFFF
Зеленый = 00FF00	Темно-зеленый = 008000
Черный = 000000	Индиго = 800080
Пурпурный = CC33FF	Темно-красный = 800000

Для изменения цвета текущего текста можно в любом месте домашней страницы воспользоваться тегом:

<FONT COLOR= “Код цвета”> Текущий текст </FONT>.

Вставка рисунка

Рисунки хранятся на Web-узлах в отдельных файлах, но отображаются как элементы Web-страниц. Изображения могут быть выведены на экран так же,

как текст. Файлы изображения могут быть заданы в нескольких различных

форматах, наилучшие из которых - GIF (файлы *.gif) и JPEG (файлы *.jpg).

Для вставки рисунка используется текстовый элемент, задаваемый непарным тегом <IMG>. Тег <IMG> должен содержать обязательный атрибут SRC=, задающий адрес URL файла с изображением в относительной или абсолютной форме.

При отображении рисунка браузер по умолчанию использует его реальные размеры.

Если рисунок необходимо отмасштабировать, применяют атрибуты WIDTH= и HEIGHT=, задающие ширину и высоту рисунка (в пикселях), соответственно. Если эти параметры заданы, то браузер может определить, какое место надо выделить для отображения рисунка, еще до того, как рисунок загружен. Это несколько ускоряет отображение загружаемой страницы, так что удобно задавать эти атрибуты всегда.

Внешний вид Web-страницы зависит от того, как именно рисунок располагается на ней. Так как рисунок задается как текстовый элемент, находящийся внутри какого-то абзаца, по умолчанию он рассматривается как встроенное изображение, включаемое в строку текста. Чтобы изображение отображалось автономно, его включают в отдельный абзац.

Атрибут ALT тега <IMG> позволяет пользователям, браузеры которых видят только текст (или если в браузере отключен режим графики), получить представление о том, что за графика расположена на странице или каковы ее цели. Microsoft Internet Explorer показывает текст из атрибута ALT= в ограничивающем прямоугольнике, пока изображение загружается. Netscape Navigator выводит этот текст в том случае, если режим Auto Load Image выключен. Тег <IMG> с атрибутом ALT= будет выглядеть следующим образом:

<IMG SRC="picture1.gif" ALT="Текст" ALIGN="DIRECTION" WIDTH="150" HEIGHT="100">, где:

"picture1.gif" - это имя файла, который будет отображаться в вашем документе.

"Текст" - это текст, выводимый вместо изображения, если файл изображения по какой-либо причине недоступен.

DIRECTION - место расположения изображения. Принимает следующие возможные значения:

v ALIGN="TOP" - последующий текст располагается в верхней части изображения.

v ALIGN="BOTTOM" - последующий текст располагается в нижней части изображения.

v ALIGN="MIDDLE" - изображение находится в центре листа.

Однако более предпочтительно использование «плавающего»

изображения, обтекаемого текстом, что также достигается использованием атрибута ALIGN=:

v ALIGN="LEFT" - изображение находится в левой части листа. Текст

обтекает изображение справа.

v ALIGN="RIGHT" - изображение находится в правой части листа. Текст обтекает изображение слева.

В этом случае рекомендуется помещать тег <IMG> в самое начало соответствующего абзаца.

Ещё один способ применения изображений на Web-страницах состоит в использовании их в качестве фонового рисунка. При отображении документа, содержащего фоновый рисунок, на компьютере рабочая область окна заполняется этим рисунком последовательно (как паркетом), считая от верхнего левого угла документа или окна. Фоновый рисунок задается с помощью атрибута BACKGROUND= в теге <BODY>. Значением этого атрибута должен быть абсолютный или относительный адрес URL для файла с изображением.

<BODY BACKGROUND="13.gif"

Практическая работа №5

Форматирование текста.

На этом занятии мы научимся изменять начертание символов, задавать цвет текста и фона.

Давайте вспомним теги и их атрибуты, которые нам сегодня понадобятся.

Начертание символов задается при помощи парных тегов:

v B - жирный (Bold);

v I - курсив (Italic);

v U - с подчеркиванием (Underline);

v S - с перечеркиванием (STRIKE).

Цвета и изображения фона задаются с помощью команды <BODY>.

Эта команда может задаваться только в начале HTML файла и не может быть изменена в дальнейшем. Ее параметры:

v bgcolor = “# код цвета” - цвет фона документа,

v text = “# код цвета” - цвет текста документа,

v link = “# код цвета” - цвет текста, используемого в качестве ссылки,

v vlink = “# код цвета” - цвет ссылки на просмотренный ранее документ,

v alink = “# код цвета” - цвет ссылки в момент нажатия на нее правой кнопки мыши.

Код цвета задается в кодировке RGB - шесть шестнадцатеричных чисел.

Белый = FFFFFF	Малиновый = FF00FF
Желтый = FFFF00	Бирюзовый = 008080
Красный = FF0000	Темно-синий = 000080
Серый = 808080	Коричневый = 808000
Синий = 0000FF	Голубой = 00FFFF
Зеленый = 00FF00	Темно-зеленый = 008000
Черный = 000000	Индиго = 800080
Пурпурный = CC33FF	Темно-красный = 800000

Для изменения цвета текущего текста можно в любом месте домашней страницы воспользоваться тегом:

<FONT COLOR= “Код цвета”> Текущий текст </FONT>.

Давайте создадим такую страничку.

Чтобы создать WEB-страничку выполним следующий ряд заданий:

1. В меню ПУСК ПРОГРАММЫ СТАНДАРТНЫЕ БЛОКНОТ.

Перед вами окно БЛОКНОТа, в котором и будет записываться код вашей странички.

3. В данном окне запишите код программы. Для удобства сначала наберите текст вашей страницы, а потом займитесь его форматированием. Придайте вашей страничке более интересный вид: задав фон и выбрав для шрифта определенный цвет. Сделайте строку адреса бегущей.

Следующую страничку сделайте сами.

5.1. Использование собственного шаблона web-сайта.

Алгоритм использования собственного шаблона, созданного в графическом редакторе.

1. С помощью графического редактора Adobe PhotoShop задаем размер будущей страницы (обычно 780-800 пиксел).

2. В том же редакторе делаем подробную прорисовку сайта, причем, там где использованы нестандартные заливки (градиент, текстура, фото), шрифты и текст мы указываем сразу. Необходимо помнить, что разметка должна напоминать таблицу, так как в дальнейшем нам предстоит ее разрезать для размещения в таблице.

3. При выборе цветов, мы пользуемся только цветами «Для Web», и желательно сохранять исходный файл для уточнения цветов (Adobe PhotoShop позволяет просматривать как графические характеристики оттенка, так и 16-ричный код любого цвета).

4. После подробной прорисовки переходим к разрезанию страницы, чтобы в дальнейшем вписать ее в разметочную таблицу. Разрезаем с помощью инструмента Выбор фрагмента, для более правильной разметки сначала лучше отделить все горизонтальные фрагменты, а потом каждый такой горизонтальный фрагмент разрезать вертикально. Для этого по единственному фрагменту щелкнем правой кнопкой мыши и выбираем Делить кусок. Затем отмечаем по вертикали или горизонтали делить объект, и на сколько кусков.

5. Когда вы отметили фрагменты, то визуально подгоняем их по размеру рисунка.

6. После разметки всех фрагментов, сохраняем с помощью команды Файл → Сохранить для Web и в типе файла выбираем HTML and Images (*.html).

7. Затем открываем нашу страничку во FrontPage и редактируем как Web-документ.

ИСПОЛЬЗУЕМАЯ ЛИТЕРАТУРА.

1. Будилов В.А. Практические занятия по HTML. Краткий курс.: Изд. Наука и техника, Санкт-Петербург, 2001.

2. Задачник-практикум по информатике для 7-11 классов (в 2 частях)/Под ред. И. Г. Семакина, Е. К. Хеннера. М.: Лаборатория Базовых Знаний, 1999-2004.

3. Microsoft Publisher 2000 «Шаг за шагом». Эком. Москва, 2002

4. Симонович С.В. Интернет для школьников. Знание. Понимание. Применение: Изд. «ДЕСС КОМ», «I-Press», Москва, 2000.

5. Хестер Н.Ф. FrontPage для Windows. М.;

-2002 г .

6. Холмогоров В. Основы Web-мастерства, 2-е изд., Учебный курс.: Изд. ПИТЕР, 2003.

7. http://doxx.tr.dn.ua:8101/manuals/master/index.htm